안녕하세요 염치 없지만 질문 최신글 관련 질문 드립니다.
본문
http://www.jisim.or.kr/index.php
현제 메인에 갤러리 게시판을 하나 만들고 있는데요
근데 문제는 이미지는 정상적으로 나오는 것 같은데 아래 타이틀 바와 그리고 이미지가 옆으로 나열이 되어야 하는데 그렇게 되지 않고 아래로 떨어지는 현상 입니다.
왜 그러는 것인지 궁금 합니다.
답변 2
<div> 는 기본적으로 블록 레벨 요소입니다.
블록 (block) 레벨 요소는 가로 공간 전부를 차지한다는 의미입니다.
인라인 요소로 바꾸기 위해 float 와 같은 속성을 지정해 줄 수 있습니다.
최신 이미지를 출력하는 div 태그에 float:left 와 같은 인라인 요소 변경 스타일을 지정해 주면 됩니다.
<div style="float:left">
이미지 #1
</div>
<div style="float:left">
이미지 #2
</div>
네감사합니다
제가내일해보고안되멘다시문의드리도록하겠습디다
오늘밤도좋은밤되세요정말감사드립니다
알려주신 사이트에 가서 확인해보니
개발자 도구로 보시면
가로 사이즈를 넓게 차지하는것이 몇개 보입니다.
/*-- style.css --*/
#latest_shop .img-thumbnail {
/* width:100%; 이것 제거*/
}
site_strap.css 의
.img-thumbnail {
/* max-width:100% //이것 제거 를 제거하시고 */
}
html 소스보기상에서
<div>
<a class="img-thumbnail img-thumbnail-hover-icon mb-xs mr-xs" href="http://www.jisim.or.kr/bbs/board.php?bo_table=photo&wr_id=2">
<img src="http://www.jisim.or.kr/data/file/photo/thumb-2083729301_of3UuFEX_24648b4a54e942dd6f8ead9e481a7da22c15c5bf_210x210.png" alt="" width="" height="" class="img-responsive" title=""> <p class="m-none">
사진 자료 </p>
</a>
</div>
의 내용에 div에 style 부여
//다음과 같이
<div style="float:left">
<a class="img-thumbnail img-thumbnail-hover-icon mb-xs mr-xs" href="http://www.jisim.or.kr/bbs/board.php?bo_table=photo&wr_id=2">
<img src="http://www.jisim.or.kr/data/file/photo/thumb-2083729301_of3UuFEX_24648b4a54e942dd6f8ead9e481a7da22c15c5bf_210x210.png" alt="" width="" height="" class="img-responsive" title=""> <p class="m-none">
사진 자료 </p>
</a>
</div>
하시면 두줄로 된게 한줄로 나옵니다.
네감사합니다
제가내일해보고혹시안되먼다시문의드리도록하겠습디다좋은밤되세요
답변을 작성하시기 전에 로그인 해주세요.
