사이트 하단 부분 질문!!
본문
사진에서 빨간박스 부분을 빨간 화살표와 같이 아래로 내리고
사진과 사진 사이간격을 파란 화살표와 같이 넓히려고 하는데,
방법좀 알려주세요 ㅠㅠ padding 을 써서 해보았는데 변화가 없어서 ..제가 잘 못쓴건지..?
도와주세요~~~
<div class="widget-box"><?php echo apms_widget('basic-member-list', 'wm9');?></div>
<?php } ?>
</div>
</div>
<div>
<div>
<script type='text/javascript' src='https://adver.clickmon.co.kr/ADVER_server/ad_view/pop_ad.php?PopAd=CM_M_1000031%7C%5E%7CCM_A_1037172%7C%5E%7CAdver_M_1002398'></script>
<script type='text/javascript' src='https://adver.clickmon.co.kr/ADVER_server/ad_view/pop_ad.php?PopAd=CM_M_1000033%7C%5E%7CCM_A_1037172%7C%5E%7CAdver_M_1000072'></script>
</div>
</div>
</div>
</div>
답변 2
margin-top, margin-right 를 써볼 수 있습니다.
ex.
<div style="margin-top:30px;border:1px solid red">
<div style="margin-right:20px;border:1px solid blue">
이미지1
</div>
<div style="border:1px solid green">
이미지2
</div>
</div>
이렇게 하였더니 사진이 한칸씩 아래로 내려가네요 ㅠ 일렬로 나열 되어야 하는데
크롬 요소 검사 기능을 이용해 어디가 원인인지 찾아보세요.
마진중복 관련 키워드도 조회해 보시구요.
padding 을 어디에 써야되는건지 잘 모르겠어요 ㅠ
크롬으로 접속 후 의심되는 부분마다 커서 찍고 요소 검사해보면,
우측 하단에 해당 요소의 margin, padding , border 등 상태를 보여주는 상자가 보일 거에요.
그거 참고해 작업해 보세요.
일단 각 div 요소마다 border 테두리를 줘서 어떤 요소가 얼마 만큼의 부분을 차지하는지 확인해 보세요.