开发者

CSS left floats sitting on top of each other

开发者 https://www.devze.com 2023-01-14 09:04 出处:网络
So, I\'m trying to create a div class that will display in a row and then automatically wrap to the next row when all the space is taken up.

So, I'm trying to create a div class that will display in a row and then automatically wrap to the next row when all the space is taken up.

.contributor_thumbnail {

    display: block;
    float: left;
    width: 150px;
    height: 150px;
    border: 1px solid #777;

}

So that when I call the code like this:

   <div class="contributor_thumbnail">thumb here</div>
   <div class="contributor_thu开发者_StackOverflow中文版mbnail">thumb here</div>
   <div class="contributor_thumbnail">thumb here</div>
   <div class="contributor_thumbnail">thumb here</div>

The divs will sit side by side.

Right now the divs just overlap. Any ideas?


Edit: Completely misread your question... Thought you said you didn't want it to be in a row. D'oh, well I'll leave this here just in case someone didn't know.


You're looking for the CSS clear property. Just add clear: both; to your CSS.

http://www.w3.org/TR/CSS2/visuren.html#flow-control

Fiddle http://jsfiddle.net/zRKYM/

0

精彩评论

暂无评论...
验证码 换一张
取 消