[thelist] why doth i hate css? let me count the ways.

Saila, Craig csaila at globeandmail.ca
Fri Oct 10 09:39:26 CDT 2003


Chris W. Parker wrote:
> 4. Why can't I easily and with one command center anything
> vertically? (The following code should work like I would expect it

Because it only applies to inline elements and 'table-cell' elements:
<http://www.w3.org/TR/CSS2/visudet.html#propdef-vertical-align>

But, given your mark-up, you can "fake it" by setting the display to
"table-cell" in Mozilla and Opera (and possible others, it doesn't work,
though in IE 5.5):
 #vertical { display: table-cell; vertical-align: middle; height: 300px;
} 

By doing this, you can even remove the parent DIV, "box".

Switching it to "table-cell", though reduces the width to match the
width of the inline content unless it is set to a certain value.

That being said, a lot of people would like to see "vertical-align"
apply to all block elements...

> 5. And along the lines of #4, why can't I make a box stretch 100%
> vertically? 

You can, depending on what you want. Given:
 <body> 
  <div> 
   <p>Some text</p> 
  </div> 
 </body> 

This CSS will stretch the P to be 100% of the DIV:
 div {height: 300px; } 
 p { height: 100%; } 

And this CSS will stretch the DIV to be 100% of the BODY in Mozilla,
Opera and IE 5+ on Windows (IE 5/Mac has issues with "height: 100%"):
 html, body { height: 100%; margin: 0; padding: 0; } 
 div { height: 100%; } 

For more:
<http://www.xs4all.nl/~ppk/css2tests/index.html?100percheight.html>

-- 
Cheers,

Craig Saila
------------------------------------------
craig at saila.com : http://www.saila.com/
------------------------------------------ 


More information about the thelist mailing list