I am struggling for few days with DIV HTML layout I was hoping to get some help,
Current point in the document is three DIV'S, the three divs are contained in "container" div (180*400 px)
Top two DIV'S in the container split 50% of the width (right is logo, lef开发者_开发技巧t is date)
And additional div (green color) take the rest of the height (400px - 100px of logo)
I am unable to set the (White) DIV to occupy all the remaining 50% width also i am unable to tell the bottom div (Green) to occupy 100% of the remaining height
Here is an illustration:
http://jsfiddle.net/dwuZp/6/
Thank you for your help (and patience)
Not sure this is what you want. It is hard to tell from the question. Here is what I did though:
Added explicit
width
s to your topfloated
elements. Floats need widths in order to float properly.Added explicit
height
s to yourtime
andlogo
divs.
Hopefully that comes close.
http://jsfiddle.net/jasongennaro/dwuZp/9/
The green div IS occupying 100% of the remaining container height, it's just that its container div, #logoTimeAndIcons
, isn't the full height of its container div, #container
.
Also, the logo image is 100px, which is 10px more than 50% of the 180px width of the container...
精彩评论