SitePoint Sponsor

User Tag List

Results 1 to 11 of 11

Thread: middle

  1. #1
    SitePoint Member
    Join Date
    Apr 2002
    Posts
    6
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    middle

    How can I center page content vertically by valid XHTML and CSS?
    Becouse XHTML doesn't support attribute height for tables, so I can't use <table height="100%"><tr><td valign="middle">...</td></tr></table>.

  2. #2
    What? Maelstrom's Avatar
    Join Date
    Oct 2001
    Location
    Whistler BC originally from Guelph Ontario
    Posts
    2,175
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    <td style="vertical-align:middle">cell1</td>

    Obviously you don't want to use inline styles but that is just an example.

    As for height you can do the same thing

    <td style="vertical-align:middle;height:100%">cell1</td>

    To learn more about css basics

    www.w3schools.com
    Maelstrom Personal - Apparition Visions
    Development - PhP || Mysql || Zend || Devshed
    Unix - FreeBSD || FreeBsdForums || Man Pages
    They made me a sitepoint Mentor - Feel free to PM me or Email me and I will see if I can help.

  3. #3
    SitePoint Member
    Join Date
    Apr 2002
    Posts
    6
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    10x, Maelstrom,
    but I tested
    <table><tr><td style="vertical-align:middle;height:100%">cell1</td></tr></table>
    in IE 5.5, NN 6.01, Mozilla 1.0
    and it doesn't work.

    Works <table style="height: 100%"><tr><td style="vertical-align:middle">cell1</td></tr></table> only in IE 5.5
    Last edited by bskd; Apr 27, 2002 at 20:34.

  4. #4
    SitePoint Wizard
    Join Date
    Oct 2001
    Location
    Tucson, Arizona
    Posts
    1,858
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Read this thread to gain some very valuable insight into this issue. You'll enjoy it.

  5. #5
    SitePoint Member
    Join Date
    Apr 2002
    Posts
    6
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    ok matt, i read it.
    The working (good) solution is by using negative margins. But it requires fixed sizes of content.
    In my case I haven't fixed sizes, i want to create a template and to use it without reckonning the content height in every page of the site.
    Obviously there aren't working solution.

  6. #6
    What? Maelstrom's Avatar
    Join Date
    Oct 2001
    Location
    Whistler BC originally from Guelph Ontario
    Posts
    2,175
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Ie6, moz1, net6 AND opera
    Code:
    <table width="500px" border="1" style="height:100%">
    	<tr>
    		<td style="vertical-align:middle;height:100%">cell1</td>
    	</tr>
    </table>
    Creates a table with one cells' information centred
    Maelstrom Personal - Apparition Visions
    Development - PhP || Mysql || Zend || Devshed
    Unix - FreeBSD || FreeBsdForums || Man Pages
    They made me a sitepoint Mentor - Feel free to PM me or Email me and I will see if I can help.

  7. #7
    SitePoint Member
    Join Date
    Apr 2002
    Posts
    6
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Smile

    Yes, it creates, but without XHTML DOCTYPE! Whit XHTML DOCTYPE it doesn't work.
    Without Doctype I can use ordinary table attributes.

  8. #8
    What? Maelstrom's Avatar
    Join Date
    Oct 2001
    Location
    Whistler BC originally from Guelph Ontario
    Posts
    2,175
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Originally posted by bskd
    Yes, it creates, but without XHTML DOCTYPE! Whit XHTML DOCTYPE it doesn't work.
    Without Doctype I can use ordinary table attributes.
    you must be validating strict? Ok now I will play

    Edit:


    The middle part works. But 100% doesn't work on height. You could use javascript to find height and fill it
    Last edited by Maelstrom; Apr 27, 2002 at 19:36.
    Maelstrom Personal - Apparition Visions
    Development - PhP || Mysql || Zend || Devshed
    Unix - FreeBSD || FreeBsdForums || Man Pages
    They made me a sitepoint Mentor - Feel free to PM me or Email me and I will see if I can help.

  9. #9
    SitePoint Member
    Join Date
    Apr 2002
    Posts
    6
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Smile

    you must be validating strict
    no, not only strict, and Transitional it doesn't work.
    It's because in XHTM there isn't height for tables.
    I tried to do it with <div> but ...

  10. #10
    What? Maelstrom's Avatar
    Join Date
    Oct 2001
    Location
    Whistler BC originally from Guelph Ontario
    Posts
    2,175
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Originally posted by bskd


    no, not only strict, and Transitional it doesn't work.
    It's because in XHTM there isn't height for tables.
    I tried to do it with <div> but ...
    Funny I am using transitional andit does work...in strict it doesn't at all...
    Maelstrom Personal - Apparition Visions
    Development - PhP || Mysql || Zend || Devshed
    Unix - FreeBSD || FreeBsdForums || Man Pages
    They made me a sitepoint Mentor - Feel free to PM me or Email me and I will see if I can help.

  11. #11
    SitePoint Member
    Join Date
    Apr 2002
    Posts
    6
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Smile

    Originally posted by Maelstrom
    The middle part works. But 100% doesn't work on height. You could use javascript to find height and fill it
    ok... 10x


Bookmarks

Posting Permissions

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