css - Div nest structure -
i have met problem don't know wrong. code here:
<html> <head> <style type="text/css"> #top{ width:100%; height: 78%; background-color: #ccc; } #left{ width: 45%; height: 100%; display: inline-block; background-color: green; } #right{ width:50%; height: 100%; display: inline-block; background-color: pink;} </style> </head> <body> <div id="top"> <div id="left"> <div id="inside">asd</div> </div> <div id="right"></div> </div> </body> </html>
if add nothing "inside" div, layout alright , this:
but if add tag or few words in "inside" dev .the layout wrong.
i'm new html,so don't know problem,who can tell me why happens? i've been driven crazy!!!help~~~~:(
you can use float (see other answers), don't have if don't want to.
#left, #right { vertical-align:top; }
will want.
aside: should add <!doctype html>
top of page. in case, you'll need add
html, body { height: 100% }
to css.
Comments
Post a Comment