Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 8 of 8
  1. #1
    Regular Coder
    Join Date
    Jul 2002
    Posts
    197
    Thanks
    0
    Thanked 0 Times in 0 Posts

    How to align this vertically?

    In the HTML below I want to align the text vertically. But I don't know how to do it. Can anyone help?

    <html>
    <head>
    <style type="text/css"><!--
    #layer { position: absolute; top: 16px; left: 16px; width: 200px; height: 200px; border-style: dashed; border-color: red; visibility: visible }-->
    </style>
    </head>
    <body>
    <div id="layer">this text should be vertically aligned in this layer. But I don't how how to do it. </div>
    </body>
    </html>

    Kippie

  • #2
    Senior Coder
    Join Date
    Jun 2002
    Location
    Nashua, NH
    Posts
    1,724
    Thanks
    0
    Thanked 0 Times in 0 Posts
    #layer
    {
    ...
    text-align:center;
    ...
    }
    Vladdy | KL
    "Working web site is not the one that looks the same on common graphical browsers running on desktop computers, but the one that adequately delivers information regardless of device accessing it"

  • #3
    New Coder
    Join Date
    Jun 2002
    Location
    Paris, France
    Posts
    47
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Vladdy, that align's the text horizontally.

    Code:
    vertical-align : 50%;
    Should work... I'm not sure though.
    I don't suffer from insanity, I enjoy every single minute of it!

  • #4
    Regular Coder
    Join Date
    Jul 2002
    Posts
    197
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Thanks Vladdy,
    But I'm afraid you mean horizontal alignment. But I'm looking for vertical alignment.
    Kippie

  • #5
    Regular Coder
    Join Date
    Jul 2002
    Posts
    197
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Thanks Flamerule,
    But this doesn't seem to work also. Who can help?
    Kippie

  • #6
    Senior Coder
    Join Date
    Jun 2002
    Location
    Nashua, NH
    Posts
    1,724
    Thanks
    0
    Thanked 0 Times in 0 Posts
    oops... excuse my original brainfart....

    ...ok this works in Gekko browsers as it should....
    Code:
    #layer 
    { position: absolute;
      display: table-cell;
      vertical-align: middle; 
      top: 16px; 
      left: 16px; 
      width: 200px; 
      height: 200px;
      border-style: dashed; 
      border-color: red; 
      visibility: visible;
     }
    but I guess you would have to do this to accomodate the stoopid IE:

    Code:
    <table id="layer">
    <td valign="center">this text should be vertically
     aligned in this layer.
     But I don't how how to do it.
    </td>
    </table>
    Last edited by Vladdy; 07-10-2002 at 12:00 AM.
    Vladdy | KL
    "Working web site is not the one that looks the same on common graphical browsers running on desktop computers, but the one that adequately delivers information regardless of device accessing it"

  • #7
    Regular Coder
    Join Date
    Jul 2002
    Posts
    197
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Thanks,
    But is there no way to align vertically without using table commands?
    Kippie

  • #8
    New Coder
    Join Date
    Jun 2002
    Location
    Paris, France
    Posts
    47
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Code:
    <table id="layer">
    <td valign="center">this text should be vertically
     aligned in this layer.
     But I don't how how to do it.
    </td>
    </table>
    It's <td valign="middle">
    I don't suffer from insanity, I enjoy every single minute of it!


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •