<div>레이아웃이 제 생각대로 잘 안되네요</div> <div> </div> <div>우선 메인에 article이라고 클래스를 두고 거기에 사진을 넣었는데 </div> <div> </div> <div>자꾸 이상하게 가네요</div> <div> </div> <div>수정전 소스를 보여드리자면 </div> <div> </div> <div> .article { /*메인내에 속하는거고,, 566px중에 좌우패딩이 96이므로 내용은 470px*/<br /> padding: 40px 8.48056537%; /* 48px / 566px //좌우 */<br /> }</div> <div> .date {<br /> float: left;<br /> margin-left: -17.23404255%; /* -81px / 470px */<br /> width: 14.68085106%; /* 69px / 470px */<br /> }<br /> <br /> .figure {<br /> float: right;<br /> margin-bottom: 0.5em;<br /> margin-left: 2.53164557%; /* 12px / 474px */<br /> width: 48.7341772%; /* 231px / 474px */<br /> }</div> <div> img,<br /> embed,<br /> object,<br /> video {<br /> max-width: 100%;<br /> /*min-width: 100%;*/<br /> }</div> <div> </div> <div><body><br /> <div id="page"><br /> <div class="blog"><br /> <h1 class="lede">Recently in <a href="#">The Bot Blog</a></h1></div> <div> <div class="main"><br /> <div class="article><br /> <strong> <div class="date"><br /> </strong> <strong>오후 5:10 2013-11-12<br /></strong> <strong> </div><br /></strong> article<br><br><br><br /> <div class="figure"><br /> <p><br /> <img src="hyuna2.png" alt="" /><br /> <b class="figcaption">Lo, the robot walks</b><br /> </p><br /> </div><!-- /end .main --><br /> </div><!-- /end .article--><br /> </div><!-- /end .main --></div> <div> </div> <div> <div class="other"><br /> other<br /> </div><!-- /end .other --><br /> </div><!-- /end .blog.sectoin --><br /> </div><!-- /end #page --><br /></body></div> <div> </div> <div><img style="border-bottom: medium none; border-left: medium none; border-top: medium none; border-right: medium none" id="image_06536595667656107" class="chimg_photo" alt="source1.png" src="http://thimg.todayhumor.co.kr/upfile/201311/1385706102oE969bfh.png" width="800" height="650" /></div> <div> </div> <div>우선 여기서는 생각대로 붙는데요 저기 date를 나중에 자바스크립트로 바꿔서 지금 회색부분(page)와 하늘색부분(page)에 걸치게 만들려고</div> <div> </div> <div>date 위치를 바꾸려고 하다보니까 date 저렇게 검은볼트부분만 빼고 새로고침 해봤는데 </div> <div style="text-align: left"> </div> <div style="text-align: left"> <div style="text-align: left"><img style="border-bottom: medium none; border-left: medium none; border-top: medium none; border-right: medium none" id="image_09272529888150691" class="chimg_photo" alt="source3.png" src="http://thimg.todayhumor.co.kr/upfile/201311/1385706226vncup7DN2VcUcK1akYoOhJnUnT.png" width="800" height="653" /></div></div> <div> </div> <div>이런식으로 main프레임에 꽉 차더라구요 </div> <div> </div> <div>figure에는 48.73%라는 공간을 주었고 아래 img속성에서 max-depth에서 100%를 주었기 때문에</div> <div> </div> <div>사진이 48%영역을 넘어가면 안되지 않나요?? 왜 이렇게 꽉차게 나오는거죠;; </div>
댓글 분란 또는 분쟁 때문에 전체 댓글이 블라인드 처리되었습니다.