Why is vertical centering such a pain in the ass?

Discussion in 'HTML' started by Ciaran, May 16, 2007.

  1. Ciaran

    Ciaran Guest

    What ever happened to the easy idea that you could just tag something
    valign='middle' and it would align to the middle of the cell?? Don't
    get me wrong, CSS is a dream come true for anyone who's worked without
    it and I'm well used to the ins and outs of it by now but some things
    that used to be so easy are just such a pain in the ass now!
    Can someone please give me a hand vertical centering this bit of text
    in a div without extra markup?

    <div style="border-top: solid 1px #999999;text-align:center; font-size:
    7pt; height:3%;>bit of text</div>

    I've tried, vertical align, line height, various display rules,
    padding values and position:relative.

    Something as basic as this really should not be this difficult to pull
    off!
    Cheers,
    CiarĂ¡n
    Ciaran, May 16, 2007
    #1
    1. Advertising

  2. Ciaran

    John Hosking Guest

    Ciaran wrote:

    > Can someone please give me a hand vertical centering this bit of text
    > in a div without extra markup?
    >
    > <div style="border-top: solid 1px #999999;text-align:center; font-size:
    > 7pt; height:3%;>bit of text</div>
    >
    > I've tried, vertical align, line height, various display rules,
    > padding values and position:relative.


    Does this help you?
    http://www.student.oulu.fi/~laurirai/www/css/middle/

    --
    John
    John Hosking, May 16, 2007
    #2
    1. Advertising

  3. Ciaran

    Ciaran Guest


    > Does this help you?http://www.student.oulu.fi/~laurirai/www/css/middle/
    >


    Not really John but thanks for the reply. I've seen that page before
    and tried all those things on the code snippet above but nothing
    works. I'm more interested in why it has to be so complicated than
    finding a solution to that problem. I mean I can do it with an extra
    bit of markup if I need to but I'm digging my heels in here. It should
    not be this messy to do something so simple.


    Ciaran
    Ciaran, May 17, 2007
    #3
  4. Ciaran

    dorayme Guest

    In article
    <>,
    Ciaran <> wrote:

    > I mean I can do it with an extra
    > bit of markup if I need to but I'm digging my heels in here. It should
    > not be this messy to do something so simple.


    If it is just a bit of extra markup, why cut off your nose to
    spite your face? It is indeed a great frustration that the world
    is not more perfect than it is. On this particular matter, you
    might consider that implementing what you want might not be so
    simple a task.

    Ever gotten frustrated at the timing of traffic lights on your
    route? It would be simple enough, you think, to not have it so
    you have to stop at so many considering you are going at a legal
    and moderate speed. But coordinating that with thew cross flow
    traffic routes is a major headache for trafficc engineers.

    OK, that is one point. The other is this, it may not be so
    important to be doing this vertical centering. And where it is,
    there are ways to be getting by.

    --
    dorayme
    dorayme, May 17, 2007
    #4
  5. Ciaran

    Ben C Guest

    On 2007-05-17, Ciaran <> wrote:
    >
    >> Does this help you?http://www.student.oulu.fi/~laurirai/www/css/middle/
    >>

    >
    > Not really John but thanks for the reply. I've seen that page before
    > and tried all those things on the code snippet above but nothing
    > works. I'm more interested in why it has to be so complicated than
    > finding a solution to that problem. I mean I can do it with an extra
    > bit of markup if I need to but I'm digging my heels in here. It should
    > not be this messy to do something so simple.


    It's true they could have provided some way to vertically centre an
    absolutely positioned box while letting it have a height based on
    content. A small change to section 10.6.4 paragraph 3 is all it would
    take.

    If you allow vertical centering everywhere things do start to get
    complex, particularly if the vertically centered text is flowing around
    floats that start in nearby blocks, since those would affect its height,
    which would affect its position (because it's centered), which means it
    now flows differently around the floats, affecting its height, which
    would affect its position... What are the chances of IE ever getting
    something like that right? Better not to set the bar too high.

    But it's not often that vertical centering is particularly useful I
    think since everything tends to flow downwards off the bottom of the
    viewport anyway.
    Ben C, May 17, 2007
    #5
    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. Brent White

    Sorry to be such a pain

    Brent White, Oct 24, 2005, in forum: ASP .Net
    Replies:
    5
    Views:
    526
    Juan T. Llibre
    Oct 25, 2005
  2. Tomas
    Replies:
    3
    Views:
    770
    Tomas
    Oct 31, 2003
  3. Replies:
    3
    Views:
    4,968
  4. Mr. SweatyFinger
    Replies:
    2
    Views:
    1,675
    Smokey Grindel
    Dec 2, 2006
  5. jef
    Replies:
    4
    Views:
    201
    Dietmar Meier
    Apr 6, 2005
Loading...

Share This Page