이미지가 아래로 내려갑니다..

이미지가 아래로 내려갑니다..

QA

이미지가 아래로 내려갑니다..

본문

<div class="container text-center">
  <h3>외 과</h3><br>
 <!--<div class="row" style="display: block">-->

    <div class="col-sm-6 zzz" id="start">
 <img class="map" id="Image-Maps-Com-image-maps-2018-02-04-224418" src="<?php echo G5_THEME_URL?>/kmle/img/kmle1_2.png" border="0" width="399" height="442" orgWidth="399" orgHeight="442" usemap="#image-maps-2018-02-04-224418" alt="" class="btn-toggle"/>
<map name="image-maps-2018-02-04-224418" id="ImageMapsCom-image-maps-2018-02-04-224418">
<area  alt="" title="" href="http://www.naver.com/" shape="rect" coords="54,65,102,105" style="outline:none;" target="_self" onfocus="this.blur()"  class="btn-toggle"  />
<area  alt="" title="" href="http://www.naver.com/" shape="rect" coords="51,245,97,276" style="outline:none;" target="_self" onfocus="this.blur()"  class="btn-toggle"  />
<area  alt="" title="" href="http://www.naver.com/" shape="rect" coords="54,292,100,322" style="outline:none;" target="_self" onfocus="this.blur()"  class="btn-toggle"  />
<area  alt="" title="" href="http://www.naver.com/" shape="rect" coords="312,311,344,359" style="outline:none;" target="_self" onfocus="this.blur()" class="btn-toggle"   />
<area  alt="" title="" href="#aaa" shape="rect" coords="281,23,363,62" style="outline:none;" target="_self" onfocus="this.blur()"  class="btn-toggle"  />
</map>

   <div class="well well-sm"><a href="#circulatory" class="btn-toggle" >
  순환기      </a></div>
      <div class="well well-sm"><a href="#digestive" class="btn-toggle" >
  소화기      </a></div>
   <div class="well well-sm"><a href="#respiratory" class="btn-toggle" >
  호흡기      </a></div>
      <div class="well well-sm"><a href="#kidney" class="btn-toggle" >
  신장      </a></div>
   <div class="well well-sm"><a href="#blood" class="btn-toggle" >
  혈액     </a> </div>
      <div class="well well-sm"><a href="#infection" class="btn-toggle" >
  감염      </a></div>
   <div class="well well-sm"><a href="#rheumatism" class="btn-toggle" >
  류마티스      </a></div>
      <div class="well well-sm"><a href="#allergy" class="btn-toggle" >
  알레르기      </a></div>

 </div>

 

 

이렇게 div를 구성하였는데

 

이미지 div 옆에 바로 다른 div 목록이 나타났으면 하는데 아래쪽에 위치하네요...

 

어떻게 고쳐야지 그림 옆에 나타날 수 있을까요..?

이 질문에 댓글 쓰기 :

답변 1

float 속성을 써야하는데.. 다른 문제가 발생할 수 있으니 아래처럼 해보세요

 

<div class="container text-center">
   <h3>외 과</h3><br>
  <!--<div class="row" style="display: block">-->

    <div class="col-sm-6 zzz" id="start">

 <div style="display:inline-block;">
   <img class="map"  id="Image-Maps-Com-image-maps-2018-02-04-224418" src="<?php echo G5_THEME_URL?>/kmle/img/kmle1_2.png" border="0" width="399" height="442" orgWidth="399" orgHeight="442" usemap="#image-maps-2018-02-04-224418" alt="" class="btn-toggle"/>
  <map name="image-maps-2018-02-04-224418" id="ImageMapsCom-image-maps-2018-02-04-224418">
  <area  alt="" title="" href="http://www.naver.com/" shape="rect" coords="54,65,102,105" style="outline:none;" target="_self" onfocus="this.blur()"  class="btn-toggle"  />
  <area  alt="" title="" href="http://www.naver.com/" shape="rect" coords="51,245,97,276" style="outline:none;" target="_self" onfocus="this.blur()"  class="btn-toggle"  />
  <area  alt="" title="" href="http://www.naver.com/" shape="rect" coords="54,292,100,322" style="outline:none;" target="_self" onfocus="this.blur()"  class="btn-toggle"  />
  <area  alt="" title="" href="http://www.naver.com/" shape="rect" coords="312,311,344,359" style="outline:none;" target="_self" onfocus="this.blur()" class="btn-toggle"   />
  <area  alt="" title="" href="#aaa" shape="rect" coords="281,23,363,62" style="outline:none;" target="_self" onfocus="this.blur()"  class="btn-toggle"  />
  </map>
 </div>
 <div style="display:inline-block;">

    <div class="well well-sm"><a href="#circulatory" class="btn-toggle" >
    순환기      </a></div>
     <div class="well well-sm"><a href="#digestive" class="btn-toggle" >
    소화기      </a></div>
  <div class="well well-sm"><a href="#respiratory" class="btn-toggle" >
    호흡기      </a></div>
     <div class="well well-sm"><a href="#kidney" class="btn-toggle" >
    신장      </a></div>
  <div class="well well-sm"><a href="#blood" class="btn-toggle" >
    혈액     </a> </div>
     <div class="well well-sm"><a href="#infection" class="btn-toggle" >
    감염      </a></div>
  <div class="well well-sm"><a href="#rheumatism" class="btn-toggle" >
    류마티스      </a></div>
     <div class="well well-sm"><a href="#allergy" class="btn-toggle" >
    알레르기      </a></div>
  </div>

 </div>

답변을 작성하시기 전에 로그인 해주세요.
전체 141
QA 내용 검색
filter #div ×

회원로그인

(주)에스아이알소프트 / 대표:홍석명 / (06211) 서울특별시 강남구 역삼동 707-34 한신인터밸리24 서관 1404호 / E-Mail: admin@sir.kr
사업자등록번호: 217-81-36347 / 통신판매업신고번호:2014-서울강남-02098호 / 개인정보보호책임자:김민섭(minsup@sir.kr)
© SIRSOFT