Re: Centering question

Discussion in 'HTML' started by Bruno Mustone, Aug 31, 2003.

  1. "David Dorward" <> wrote in message
    news:biqc7k$ad4$1$...
    > Bruno Mustone wrote:
    > > What is the best way of creating a site where all the information is in

    a
    > > 760 x 450 block in the center of the browser without using frames?

    >
    > http://dorward.me.uk/www/centre/#block
    >
    > (Of course, its better to avoid designs which don't take advantage of
    > whatever window size the user provides)
    >
    > --
    > David Dorward http://dorward.me.uk/


    That doesn't work for the vertical alignment though. I need it to be
    centered both horizontally and vertically. I've seen it done with nested
    tables like the following but I wondered if it could be done with CSS.

    <table width="100%" border="0" cellspacing="0" cellpadding="0"
    align="center" height="100%">
    <tr>
    <td><table height="430" width="760" align="center" border="0"
    cellspacing="0" cellpadding="0" >
    <tr>
    <td></td>
    </tr>
    </table>
    </td>
    </tr>
    </table>
     
    Bruno Mustone, Aug 31, 2003
    #1
    1. Advertising

  2. David Dorward, Aug 31, 2003
    #2
    1. Advertising

  3. Bruno Mustone

    Bruno Guest

    "David Dorward" <> wrote in message
    news:bisdb1$cem$1$...
    > Bruno Mustone wrote:
    >
    > >>> What is the best way of creating a site where all the information is

    in
    > >>> a 760 x 450 block in the center of the browser without using frames?

    >
    > >> http://dorward.me.uk/www/centre/#block

    >
    > > That doesn't work for the vertical alignment though.

    >
    > http://www.milov.nl/code/css/verticalcenter.html
    >
    > --
    > David Dorward http://dorward.me.uk/


    If you change the dimensions of the block to the ones I want to use that
    doesn't work.

    If I set it up as per the following code why do elements break out of the
    confines of the table when I use absolute positioning? Surely if I put an
    element inside a table its positioning should be constrained by the
    dimensions of the table?

    <table width="100%" border="0" cellspacing="0" cellpadding="0"
    align="center" height="100%">
    <tr>
    <td><table height="430" width="760" align="center" border="0"
    cellspacing="0" cellpadding="0" >
    <tr>
    <td><div style="position: absolute; left:
    0px;">test</div></td>
    </tr>
    </table>
    </td>
    </tr>
    </table>
     
    Bruno, Aug 31, 2003
    #3
  4. Bruno wrote:

    > If you change the dimensions of the block to the ones I want to use that
    > doesn't work.


    It should work... just so long as the dimensions are absolute (which is why
    I don't use it - I almost never do absolute)

    > If I set it up as per the following code why do elements break out of the
    > confines of the table when I use absolute positioning?


    Becuase that's how absolute positioning works, its with respect to the edges
    of the nearest positioned ancestor element.

    > Surely if I put an element inside a table its positioning should be
    > constrained by the dimensions of the table?


    Not unless that table is positioned.

    > <table width="100%" border="0" cellspacing="0" cellpadding="0"
    > align="center" height="100%">


    Why are you using this table (with invalid HTML) anyway? There was no table
    in the example code I pointed at earlier).

    --
    David Dorward http://dorward.me.uk/
     
    David Dorward, Aug 31, 2003
    #4
  5. Bruno Mustone

    Bruno Guest

    "David Dorward" <> wrote in message
    news:biss6s$4el$2$...
    > Bruno wrote:
    >
    > > If you change the dimensions of the block to the ones I want to use that
    > > doesn't work.

    >
    > It should work... just so long as the dimensions are absolute (which is

    why
    > I don't use it - I almost never do absolute)


    I just changed your dimensions for the outer box from 100 x 100 to 760 x 430
    and it doesn't center it. Do I need to change the other values to
    compensate?

    > > If I set it up as per the following code why do elements break out of

    the
    > > confines of the table when I use absolute positioning?

    >
    > Becuase that's how absolute positioning works, its with respect to the

    edges
    > of the nearest positioned ancestor element.
    >


    Ah ok, I didn't realise the element had to be positioned.

    > > Surely if I put an element inside a table its positioning should be
    > > constrained by the dimensions of the table?

    >
    > Not unless that table is positioned.
    >


    Ditto

    > > <table width="100%" border="0" cellspacing="0" cellpadding="0"
    > > align="center" height="100%">

    >
    > Why are you using this table (with invalid HTML) anyway? There was no

    table
    > in the example code I pointed at earlier).
    >


    It is code I have taken from someone else's site to show exactly what I need
    to achieve. I was just trying to position elements within it just to show
    you what I mean and it didn't work so I wondered why.
     
    Bruno, Aug 31, 2003
    #5
  6. Bruno Mustone

    Bruno Guest

    "Bruno" <> wrote in message
    news:w5n4b.1703$...
    > "David Dorward" <> wrote in message
    > news:biss6s$4el$2$...
    > > Bruno wrote:
    > >
    > > > If you change the dimensions of the block to the ones I want to use

    that
    > > > doesn't work.

    > >
    > > It should work... just so long as the dimensions are absolute (which is

    > why
    > > I don't use it - I almost never do absolute)

    >
    > I just changed your dimensions for the outer box from 100 x 100 to 760 x

    430
    > and it doesn't center it. Do I need to change the other values to
    > compensate?
    >
    > > > If I set it up as per the following code why do elements break out of

    > the
    > > > confines of the table when I use absolute positioning?

    > >
    > > Becuase that's how absolute positioning works, its with respect to the

    > edges
    > > of the nearest positioned ancestor element.
    > >

    >
    > Ah ok, I didn't realise the element had to be positioned.
    >
    > > > Surely if I put an element inside a table its positioning should be
    > > > constrained by the dimensions of the table?

    > >
    > > Not unless that table is positioned.
    > >

    >
    > Ditto
    >
    > > > <table width="100%" border="0" cellspacing="0" cellpadding="0"
    > > > align="center" height="100%">

    > >
    > > Why are you using this table (with invalid HTML) anyway? There was no

    > table
    > > in the example code I pointed at earlier).
    > >

    >
    > It is code I have taken from someone else's site to show exactly what I

    need
    > to achieve. I was just trying to position elements within it just to show
    > you what I mean and it didn't work so I wondered why.
    >
    >


    Sorry It's been a long week. I've worked it out and it works great. Cheers
    for your help David.
     
    Bruno, Aug 31, 2003
    #6
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. Joe Bonavita

    Centering controls on a Web Form

    Joe Bonavita, Dec 23, 2003, in forum: ASP .Net
    Replies:
    1
    Views:
    385
    Alan Corbett \(.NET MVP\)
    Dec 23, 2003
  2. NWx
    Replies:
    1
    Views:
    344
    Ivan Demkovitch
    Feb 11, 2004
  3. tshad
    Replies:
    17
    Views:
    712
    tshad
    Dec 3, 2004
  4. Chris Leffer

    Centering popup windows

    Chris Leffer, Dec 29, 2004, in forum: ASP .Net
    Replies:
    1
    Views:
    457
    bruce barker
    Dec 30, 2004
  5. Jerry Camel

    Centering an image with text

    Jerry Camel, Sep 23, 2005, in forum: ASP .Net
    Replies:
    6
    Views:
    541
    John Timney \(ASP.NET MVP\)
    Sep 23, 2005
Loading...

Share This Page