float된 요소에 대해 궁금한게있습니다.
에녹
!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd
html xmlns=http://www.w3.org/1999/xhtml
head
title new document /title
style
ul {width:300px;height:300px;border:1px solid red;}
li {float:left;list-style:none;}
/style
/head
body
ul
li리스트/li
li리스트/li
li리스트/li
li리스트/li
li리스트/li
li리스트/li
li리스트/li
li리스트/li
li리스트/li
li리스트/li
li리스트/li
li리스트/li
li리스트/li
li리스트/li
li리스트/li
/ul
/body
/html
플로팅된요소가 부모 넓이 에 도달하거나 넘을려고하게되면 아래로 떨어져야하는게 정상아닌가요?
익스에서는 왜 저렇게 나오는지 궁금하고 해결방법도 알고싶습니다~
-
두바다찬솔
앗 갑자기 댓글이 수정되었군요 ㅎㅎ 왜안되나했는데 감사합니다^^
-
슬현
똑같이 보이게 하시려면 ul과 li margin값과 padding값 리셋하시구요 리스트 글씨가 세로로 나타나는 부분은 글씨가 있는 부분의 넓이를 영역안에 뿌려주지 못해서 뿌려줄수 있는 만큼만 뿌려주다 보니 그렇게 되는거 같습니다. li에 white-space:nowrap; 해주시면 해결 될듯 합니다. 이 속성은 li 영역에 텍스트를 넓이에 영향을 받아 밑으로 떨어지지 않게 하는 속석으로 한줄로 쭉 나열하라는 의미입니다. 그렇게 되면 밑으로 보이던 리스트