[문의] 미리보기랑 실제랑 달라서 질문드립니다

스크립트를 첨해보는지라 올려져있는 강의 보구 해봤는데요

탭을 9개 만들어서 탭마다 이미지가 뜰수 있게 해볼려구 했습니다

미리보기에선 잘되는데 저장하기 누르면 나오는건 이미지가 9개 다 풀려서 나오구

탭들도 스타일이 하나두 적용이 안되서 나옵니다

방법좀 알려주세요

<div data-inven-tabs>

    <!-- 탭 버튼 부분 -->

    <div data-inven-tab-for="tab_1"

        data-inven-selected-css="{'_SELF_':{'font-family':'copperplate gothic light','fontWeight':'bold','color':'gold','background-color':'black'}}"

        data-inven-unselected-css="{'_SELF_':{'font-family':'copperplate gothic light','fontWeight':'normal','color':'gold','background-color':'black'}}"

        style="border:1px solid; width:140px; padding: .4em; float:left;"> INFIGHTER </div>

    <div data-inven-tab-for="tab_2"

        data-inven-selected-css="{'_SELF_':{'font-family':'copperplate gothic light','fontWeight':'bold','color':'gold','background-color':'black'}}"

        data-inven-unselected-css="{'_SELF_':{'font-family':'copperplate gothic light','fontWeight':'normal','color':'gold','background-color':'black'}}"

        style="border:1px solid; width:140px; padding: .4em; float:left;"> BATTLE MASTER </div>

    <div data-inven-tab-for="tab_3"

        data-inven-selected-css="{'_SELF_':{'font-family':'copperplate gothic light','fontWeight':'bold','color':'gold','background-color':'black'}}"

        data-inven-unselected-css="{'_SELF_':{'font-family':'copperplate gothic light','fontWeight':'normal','color':'gold','background-color':'black'}}"

        style="border:1px solid; width:140px; padding: .4em; float:left;"> BERSERKER </div>

    <div data-inven-tab-for="tab_4"

        data-inven-selected-css="{'_SELF_':{'font-family':'copperplate gothic light','fontWeight':'bold','color':'gold','background-color':'black'}}"

        data-inven-unselected-css="{'_SELF_':{'font-family':'copperplate gothic light','fontWeight':'normal','color':'gold','background-color':'black'}}"

        style="border:1px solid; width:140px; padding: .4em; float:left;"> WARLOAD </div>

    <div data-inven-tab-for="tab_5"

        data-inven-selected-css="{'_SELF_':{'font-family':'copperplate gothic light','fontWeight':'bold','color':'gold','background-color':'black'}}"

        data-inven-unselected-css="{'_SELF_':{'font-family':'copperplate gothic light','fontWeight':'normal','color':'gold','background-color':'black'}}"

        style="border:1px solid; width:140px; padding: .4em; float:left;"> DEVIL HUNTER </div>

    <div data-inven-tab-for="tab_6"

        data-inven-selected-css="{'_SELF_':{'font-family':'copperplate gothic light','fontWeight':'bold','color':'gold','background-color':'black'}}"

        data-inven-unselected-css="{'_SELF_':{'font-family':'copperplate gothic light','fontWeight':'normal','color':'gold','background-color':'black'}}"

        style="border:1px solid; width:140px; padding: .4em; float:left;"> BLASTER </div>

    <div data-inven-tab-for="tab_7"

        data-inven-selected-css="{'_SELF_':{'font-family':'copperplate gothic light','fontWeight':'bold','color':'gold','background-color':'black'}}"

        data-inven-unselected-css="{'_SELF_':{'font-family':'copperplate gothic light','fontWeight':'normal','color':'gold','background-color':'black'}}"

        style="border:1px solid; width:140px; padding: .4em; float:left;"> ARCANA </div>

    <div data-inven-tab-for="tab_8"

        data-inven-selected-css="{'_SELF_':{'font-family':'copperplate gothic light','fontWeight':'bold','color':'gold','background-color':'black'}}"

        data-inven-unselected-css="{'_SELF_':{'font-family':'copperplate gothic light','fontWeight':'normal','color':'gold','background-color':'black'}}"

        style="border:1px solid; width:140px; padding: .4em; float:left;"> SUMMONER </div>

    <div data-inven-tab-for="tab_9"

        data-inven-selected-css="{'_SELF_':{'font-family':'copperplate gothic light','fontWeight':'bold','color':'gold','background-color':'black'}}"

        data-inven-unselected-css="{'_SELF_':{'font-family':'copperplate gothic light','fontWeight':'normal','color':'gold','background-color':'black'}}"

        style="border:1px solid; width:140px; padding: .4em; float:left;"> BARD </div>

    <div style="clear: left;"></div>

    <!-- 탭 내용 부분 -->

    <div data-inven-tab-id="tab_1"><img style="border: 1px solid gold; padding: .4em;" src="https://upload2.inven.co.kr/upload/2017/08/27/bbs/i13456371955.gif"></div>

    <div data-inven-tab-id="tab_2"><img style="border: 1px solid gold; padding: .4em;" src="https://upload2.inven.co.kr/upload/2017/08/27/bbs/i13438578255.gif"></div>

    <div data-inven-tab-id="tab_3"><img style="border: 1px solid gold; padding: .4em;" src="https://upload2.inven.co.kr/upload/2017/08/27/bbs/i13482221406.gif"></div>

    <div data-inven-tab-id="tab_4"><img style="border: 1px solid gold; padding: .4em;" src="https://upload2.inven.co.kr/upload/2017/08/27/bbs/i13440846027.gif"></div>

    <div data-inven-tab-id="tab_5"><img style="border: 1px solid gold; padding: .4em;" src="https://upload2.inven.co.kr/upload/2017/08/27/bbs/i14014645165.gif"></div>

    <div data-inven-tab-id="tab_6"><img style="border: 1px solid gold; padding: .4em;" src="https://upload2.inven.co.kr/upload/2017/08/27/bbs/i14026722398.gif"></div>

    <div data-inven-tab-id="tab_7"><img style="border: 1px solid gold; padding: .4em;" src="https://upload2.inven.co.kr/upload/2017/08/27/bbs/i14085356213.gif"></div>

    <div data-inven-tab-id="tab_8"><img style="border: 1px solid gold; padding: .4em;" src="https://upload2.inven.co.kr/upload/2017/08/27/bbs/i14073827939.gif"></div>

    <div data-inven-tab-id="tab_9"><img style="border: 1px solid gold; padding: .4em;" src="https://upload2.inven.co.kr/upload/2017/08/27/bbs/i14044160270.gif"></div>

</div>