[문의] 인장 세로메뉴 공간(여백)이 생깁니다 ㅠ

첨부 파일 1

출처 : 메우님의 세로메뉴 인장 http://www.inven.co.kr/board/powerbbs.php?come_idx=2652&l=440085

 

 

아래 이미지는 인벤토리 미리보기한겁니다.

 

미리보기 할 때는 메뉴간의 공간(여백)이 일정하고 롤오버 이미지도 가운데로 잘 정렬이 되었습니다.

 

 

 

 

 

 

아래 이미지처럼 메뉴간의 공간 및 정렬이 안되네요 ㅠ

인장 여러가지 하려다보니 잘 안되는거 같아요 ㅠㅠ

 

 

 

 

 

 

버튼과 내용 부분입니다.. 전체적인 소스는 첨부파일에 올렸습니다.

 

도움 주실 분 계시면 감사합니다.^^

 

 

 

 

<!--새 버튼 추가하는 곳-->

 

 <div data-inven-tabs style="padding-top: 16px;">
  <div style="float: left;">
   <div data-inven-tab-for="0" data-inven-selected-css="{'_SELF_':{'paddingLeft':'6px'}}" data-inven-unselected-css="{'_SELF_':{'paddingLeft':'2px'}}" style="width: 12px; margin: 6px 0; padding: 4px 2px; border-radius: 0 6px 6px 0; background-color: #c32e61; color: white; cursor: pointer;">메뉴1</div>

   <div data-inven-tab-for="1" data-inven-selected-css="{'_SELF_':{'paddingLeft':'6px'}}" data-inven-unselected-css="{'_SELF_':{'paddingLeft':'2px'}}" style="width: 12px; margin: 6px 0; padding: 4px 2px; border-radius: 0 6px 6px 0; background-color: #c32e61; color: white; cursor: pointer;">메뉴2</div>

    <div data-inven-tab-for="2" data-inven-selected-css="{'_SELF_':{'paddingLeft':'6px'}}" data-inven-unselected-css="{'_SELF_':{'paddingLeft':'2px'}}" style="width: 12px; margin: 6px 0; padding: 4px 2px; border-radius: 0 6px 6px 0; background-color: #c32e61; color: white; cursor: pointer;">메뉴3</div>

   <div data-inven-tab-for="3" data-inven-selected-css="{'_SELF_':{'paddingLeft':'6px'}}" data-inven-unselected-css="{'_SELF_':{'paddingLeft':'2px'}}" style="width: 12px; margin: 6px 0; padding: 4px 2px; border-radius: 0 6px 6px 0; background-color: #c32e61; color: white; cursor: pointer;">메뉴4</div>
   

   <div data-inven-tab-for="4" data-inven-selected-css="{'_SELF_':{'paddingLeft':'6px'}}" data-inven-unselected-css="{'_SELF_':{'paddingLeft':'2px'}}" style="width: 12px; margin: 6px 0; padding: 4px 2px; border-radius: 0 6px 6px 0; background-color: #c32e61; color: white; cursor: pointer;">메뉴5</div>

 

  </div>

 

 

<!--새 내용 추가하는 곳-->

 

  <div style="margin-left: 30px; margin-top: 6px; padding-bottom: 12px;">
   <div data-inven-tab-id="0" style="min-height: 300px;"><!--메뉴 1 내용-->
    <div style="display: block; width: 204px; background-image: url('https://upload2.inven.co.kr/upload/2015/11/25/bbs/i12387913663.png'); border-radius: 6px; border: 1px solid #c32e61;">
     <div style="border-bottom: 1px solid #c32e61; color: #c32e61;padding: 4px 8px; font-weight: bold;">~~~상자 제목~~~</div>
     <div style="padding: 4px 8px;">
      ~~~상자 내용~~~
     </div>
    </div>
   </div>
   <div data-inven-tab-id="1" style="display: none;"><!--메뉴 2 내용-->
    <div style="display: inline-block; padding: 4px 8px; background-image: url('https://upload2.inven.co.kr/upload/2015/11/25/bbs/i12387913663.png'); border-radius: 6px; border: 1px solid #c32e61;">
     ~~~메뉴 2 내용~~~
    </div></div>
   <div data-inven-tab-id="2" style="display: none;"><!--메뉴 3 내용-->
    <div style="display: inline-block; padding: 4px 8px; background-image: url('https://upload2.inven.co.kr/upload/2015/11/25/bbs/i12387913663.png'); border-radius: 6px; border: 1px solid #c32e61;">
     ~~~메뉴 3 내용~~~
    </div></div>
   <div data-inven-tab-id="3" style="display: none;"><!--메뉴 4 내용-->
    <div style="display: inline-block; padding: 4px 8px; background-image: url('https://upload2.inven.co.kr/upload/2015/11/25/bbs/i12387913663.png'); border-radius: 6px; border: 1px solid #c32e61;">
     ~~~메뉴 4 내용~~~
    </div></div>
   <div data-inven-tab-id="4" style="display: none;"><!--메뉴 5 내용-->
    <div style="display: inline-block; padding: 4px 8px; background-image: url('https://upload2.inven.co.kr/upload/2015/11/25/bbs/i12387913663.png'); border-radius: 6px; border: 1px solid #c32e61;">
     ~~~메뉴 5 내용~~~
    </div></div>