div 레이아웃 간격수정
본문
안녕하세요 아주 기초적인 질문이라 죄송한데요 여기저기 서치를 해봐도 이해가 잘 안가서 질문드림니다.
아래와 같이 했습니다.
<div class="row">
<div class="col-md-3">
<div class="ot">
<div style="margin:1px; border:1px solid #B23636;">
<div style="padding:10px; border:4px solid #f2f2f2;"><i class="fa fa-tags fa-lg"></i> BOARD 1<br />
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
</div>
</div>
</div>
</div>
<div class="col-md-6">
<div class="ot">
<div style="margin:1px; border:1px solid #B23636;">
<div style="padding:10px; border:4px solid #f2f2f2;"><i class="fa fa-tags fa-lg"></i> BOARD 2<br />
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
</div>
</div>
</div>
</div>
<div class="col-md-3">
<div class="ot">
<div style="margin:1px; border:1px solid #B23636;">
<div style="padding:10px; border:4px solid #f2f2f2;"><i class="fa fa-tags fa-lg"></i> BOARD 3<br />
스탠포드 대학 탐방 ($50/1인)/베이크루즈 유람선 ($28/1인)
</div>
</div>
</div>
</div>
</div>
<p></p>
<div class="row">
<div class="col-md-3">
<div class="ot">
<div style="margin:1px; border:1px solid #B23636;">
<div style="padding:10px; border:4px solid #f2f2f2;"><i class="fa fa-tags fa-lg"></i> BOARD 4<br />
스탠포드 대학 탐방 ($50/1인)/베이크루즈 유람선 ($28/1인)
</div>
</div>
</div>
</div>
<div class="col-md-3">
<div class="ot">
<div style="margin:1px; border:1px solid #B23636;">
<div style="padding:10px; border:4px solid #f2f2f2;"><i class="fa fa-tags fa-lg"></i> BOARD 5<br />
스탠포드 대학 탐방 ($50/1인)/베이크루즈 유람선 ($28/1인)
</div>
</div>
</div>
</div>
<div class="col-md-3">
<div class="ot">
<div style="margin:1px; border:1px solid #B23636;">
<div style="padding:10px; border:4px solid #f2f2f2;"><i class="fa fa-tags fa-lg"></i> BOARD 6<br />
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
</div>
</div>
</div>
</div>
<div class="col-md-3">
<div class="ot">
<div style="margin:1px; border:1px solid #B23636;">
<div style="padding:10px; border:4px solid #f2f2f2;"><i class="fa fa-tags fa-lg"></i> BOARD 7<br />
스탠포드 대학 탐방 ($50/1인)/베이크루즈 유람선 ($28/1인)
</div>
</div>
</div>
</div>
</div>
http://navahotour.com/bbs/board.php?bo_table=comm&wr_id=2 페이지 이고요
빌더는 APMS 를 사용했습니다.
그리고 페이지는 공명과맥님이 올려주신 한페이지짜리 게시판 스킨을 사용했습니다.
감사합니다.
답변 1
bootstrap.min.css 에 .col-md-3 에 적용되는 부분이군요.
padding-left와 padding-right가 15px로 설정되있습니다.
해당파일에서 수정하면 예상치 못한 다른 부분도 틀어질 우려가 있으니 이런 경우엔 차라리 게시판스킨의 css에서 수정해주시는게 좋겠습니다.
skin/board/html/style.css 에서 적당한 위치에
#bo_v_con .col-md-3, #bo_v_con .col-md-6 {padding-left:15px; padding-right:15px;}
이런식으로 추가하시면 될듯합니다. (픽셀 사이즈는 원하시는대로 수정하시면 됩니다.)
행여나 3,6 이외에도 쓰일거 같다 싶으면 1부터 10까지 다 명시해주는게 좋겠죠.