Divs wrap when a browser window is scaled down in size

This is probably the first time I've tried asking a question regarding CSS or HTML online but as the title states I'm having an issue with div's collapsing underneath each other when a browser window is reduced in size (a browser window that's not full screen). The div's are setup as a 3 div's in side a div that wraps around the 3 that are meant to lay out horizontally across the screen. I would like the browser to display a horizontal scroll bar if the window is no longer large enough to display all content horizontally rather then have the windows collapse like they are now. Below is exactly what I've put for the div's that are causing me so much frustration at the moment. .wrap { height:auto; width:100%; margin:10px 0 0 0; overflow:hidden; } .box1 { height:320px; width: 240px; border: 1px solid #777; margin: 0 0 0 10px; display: inline-block; float:left; } .box2 { height:320px; width:62%; margin: 0 -3px 0 1px; border: 1px solid #777; display:inline-block; } .box3 { height:320px; width: 240px; border: 1px solid #777; display: inline-block; }
Your divs aren't "collapsing", they're "flowing" or "wrapping". Collapse implies a loss of dimension.

以上就是Divs wrap when a browser window is scaled down in size的详细内容,更多请关注web前端其它相关文章!

赞(0) 打赏
未经允许不得转载:web前端首页 » HTML5 答疑