html - Div text not floating as I want it to when the page shrinks -
i have designed page how want when page wide, narrows goes wrong.
i have big pic (grey) left 3 small pics (yellow) left of that.
underneath block of text. when shrink page, small pics drop down below big pic. that's good. want text flow next 3 small pics. instead jumps next big pic , flows round it, round 3 small pics. if squeeze screen until width of big grey pic, text goes how want to.
i've read lots of posts can't see 1 helps. i'd grateful this.
http://jsfiddle.net/dovesandchicks/ll93ggxa/
#content { background-color: #ffffff; margin: 0px; padding: 10px; overflow: auto; } .smallpic { float: none; width: 150px; height: 117px; margin: 0px 10px 10px 0px; background-color: #ffff00; } .smallpicblock { float: left; width: 150px; height: 390px; } .bigpic { float: left; background-color: #cccccc; width: 520px; height: 371px; } .textblock { font-family: verdana, arial, helvetica, sans-serif; font-size: small; min-width: 220px; }
add
.textblock { overflow: hidden; }
enjoy :)
Comments
Post a Comment