Bob,
I really didn't want to use a table - otherwise I would have been able to
say that there isn't a single table in the whole site. Now I'll just have to
talk about the sub-sites... Grr.
Anyway, the code was a bit more complex than you posted as I had to center
vertically the text and the block.
I've updated the verion on http://www.e-oddie.com/ which works in IE, but
not FF. I just can't seem to make that work. Must be having a complete
blinder today - as I used to do everything with tables.
Anyway, I'm telling all my users to get Firefox and I'm a Firefox user so I
need to work out this prob.
Any ideas?

Thanks,
Tatham

-----Original Message-----
From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] On
Behalf Of designer
Sent: Sunday, 26 December 2004 9:41 PM
To: [email protected]
Subject: Re: [WSG] CSS alignment issues

----- Original Message ----- 
From: Tatham Oddie
To: [email protected]
Sent: Sunday, December 26, 2004 7:36 AM
Subject: [WSG] CSS alignment issues


If you look at the homepage - http://www.e-oddie.com/ - I'm having problems
laying the content out. I'm trying to centre the image on the page both
horizontally and vertically. Then, within the panel, I'm trying to
vertically centre the text. Unfortunately I'm not achieving either and am
getting different results between IE6 and FF1.

--------------------------------------------------

If you use:

body, html {
 margin  : 0;
 padding  : 0;
 height  : 100%;
}
#layoutgrid{
 display  : table;
 height  : 100%;
 width  : 100%;
}
#layoutgrid td {
 vertical-align : middle;
 text-align  : center;
}

in your css, then:

<table id="layoutgrid">
  <!-- table, as opposed to strict CSS, is needed for IE centering -->
  <tr>
    <td >
      your own stuff goes here. A div, with the text inside and the
background image applied to this div, maybe? </td>
  </tr>
</table>

in your markup, it'll work. Using that single cell table is the ONLY way I
know to get centered stuff in IE and FF without resorting to long-winded or
unreliable code.  It depends whether or not you can allow yourself the use
of a table!

HTH,

Bob McClelland,
Cornwall (U.K.)
www.gwelanmor-internet.co.uk

******************************************************
The discussion list for  http://webstandardsgroup.org/

 See http://webstandardsgroup.org/mail/guidelines.cfm
 for some hints on posting to the list & getting help
******************************************************
******************************************************
The discussion list for  http://webstandardsgroup.org/

 See http://webstandardsgroup.org/mail/guidelines.cfm
 for some hints on posting to the list & getting help
******************************************************

Reply via email to