css - HTML A problem with floating the divs -
i have problem mentioned above.
in web app, i'll generating many divs dynamically jquery(asp.net mvc). each new div can have different width, , of them must floated left
i tried (test) float left 2 divs, no success. doing wrong ?
each div has defined width, because when total width of divs > maindiv's width, scrollbar appear. now, in case, 2 divs not floated left
here's code
<div id="maindiv" style="overflow:auto; width:100%;"> <div style="width:960px; float:left; background-color:lime;"> </div> <div style="width:960px; float:left; background-color:red;"> b </div> </div>
you have make sure containing div wide enough accommodate floated div's side side.
so in example, have set width of containing div maindiv
@ least 1920px.
you need additional wrapper if want scroll-bars appear on maindiv
:
html:
<div id="maindiv" style="overflow:auto; width:100%;"> <div id="wrapper"> <div style="width:960px; float:left; background-color:lime;"> </div> <div style="width:960px; float:left; background-color:red;"> b </div> </div> </div>
css:
#wrapper { width: 1920px; }
Comments
Post a Comment