100% height div's, known CSS issue?
- Started
- Last post
- 11 Responses
- Noggin
Ive been told this is a known issue with wanting divs to expand 100% of its container... where you want adjacent boxes to stay the same height.
If one box needs more space it *should* push open the container and the adjacent box *should* expand accordingly.
Anyone got a decent fix without hacks?
- jayoh0
You need the container to expand? Like this?
http://eyes-open.com/100_div_hei…
or were you talking about the yellow boxes being the same height?
- Noggin0
The yellow boxes should expand to the same height of the largest yellow box.
- brandelec0
not a fix, but remember to clear your floating divs
- Noggin0
Yeah i have that in the dev version, the above is just the barebones for testing.
- brandelec0
quickest fix is to set a bg on the container div
- fugged0
clearing the float, inside of the content_box_row, should do the trick. Unless I'm not understanding what you want.
- fugged0
Ah, I see what you want to do. I think this is what you'll want to do. Doesn't allow an arbitrary number of columns, but since it looks like you are using absolute widths, you should be fine.
- raf0
Have you ever heard that CSS sucked?
You just discovered one of the fundamental reasons it does. CSS was invented by code nerds not designers and it shows right in your problem.
There isn't a property that tells an element to "auto-expand to the maximum width or height available within parent element".
Lack of a way to set equal column height is a direct result of that.Tables, on the other hand, do auto-stretch.
Likewise, the most intuitive and logical way to center stuff inside parent element vertically: "vertical-align: middle" does not work within block elements according to CSS rules.
It does work in table cells though, go figure.
*ends rant, pops beer open
- SteveJobs0
- I'd clear both her floats...mikotondria3
- oh no you di-n't!SteveJobs
- mm-hmm!! ah d-it !mikotondria3
- ArmandoEstrada0
http://www.tjkdesign.com/article…
use table display....