Quick CSS problem

Question

I have created fiddle here: http://jsfiddle.net/ozzy/WEGMh/

How it should look is here:

enter image description here

Issue is the left and right hand divs arent showing. I have tried z-index , but it must be something painfully obvious.

My code may be crap too..

The idea is the container height will be flexible. Container width fixed. Header fixed width and height left div will be fixed width and flexible height. right div can just adopt left divs parameters. footer div fixed width and height.

If that makes sense.

cheers generalhenry , i had thought they would assume the height of body. Like a wally... anyhoo cheers for that mate — 422
– 422, Commented Jul 2, 2011 at 1:54

Guffa · Accepted Answer · 2011-07-02 01:51:36Z

6

The left and right divs are showing, it's just that their height is zero.

They get their height from their content, and as there is nothing in them, the height becomes zero.

The default for a div is to fill up the available width, but not to fill up the available height.

answered Jul 2, 2011 at 1:51

Guffa

703k112 gold badges760 silver badges1k bronze badges

Sign up to request clarification or add additional context in comments.

6 Comments

422 Over a year ago

bugger yep ok, will try something :)

422 Over a year ago

I am such a knob, cant believe I didnt whack content in LOL ! cheers @guffa

Jared Farrish Over a year ago

@422 - Please be sure to select an appropriate answer. If this answer is appropriate, click the outlined checkmark. :)

user456814 Over a year ago

@Guffa is there documentation anywhere that explains that clearly?

tjm Over a year ago

@422, adding .left, .right { height:100%; } is the simple fix to your jsfiddle, Whether it works in your real situation is another question.

|

Collectives™ on Stack Overflow

Quick CSS problem

1 Answer 1

6 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

6 Comments

Your Answer

Sign up or log in

Post as a guest

Related