SitePoint Sponsor

User Tag List

Results 1 to 6 of 6
  1. #1
    SitePoint Zealot DrkFusion's Avatar
    Join Date
    Jan 2003
    Location
    Canada
    Posts
    118
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    CSS Nav Alignment Problem

    i I recently made a nav, the problem is it aligns to the top (see attachment) I have clearly stated in the style to vertical align it to middle.

    How do I do this? I also have a image in the attachments of how I wish for it to look


    Thanks!

    Attachments
    http://www.vasantham.ca/cssprob.gif
    http://www.vasantham.ca/cssprob-howiwantit.gif
    Attached Images Attached Images
    Last edited by DrkFusion; Apr 5, 2003 at 20:10.

  2. #2
    SitePoint Zealot DrkFusion's Avatar
    Join Date
    Jan 2003
    Location
    Canada
    Posts
    118
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by DrkFusion
    i I recently made a nav, the problem is it aligns to the top (see attachment) I have clearly stated in the style to vertical align it to middle.

    How do I do this? I also have a image in the attachments of how I wish for it to look


    Thanks!
    Umm where are the attachments?
    Attached Images Attached Images

  3. #3
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,372
    Mentioned
    180 Post(s)
    Tagged
    6 Thread(s)
    Hi,

    Vertical align determines the alignment of text within a line of text, or within a table cell. It does not vertical align text within a div.

    You will probably need to use something like padding-top: 5px; to move the text down a bit. (Or use % etc).

    Paul

  4. #4
    Put your best practices away. The New Guy's Avatar
    Join Date
    Sep 2002
    Location
    Canada
    Posts
    2,087
    Mentioned
    1 Post(s)
    Tagged
    1 Thread(s)
    I came across the same problem. I found that using padding it does something odd in IE and the total size will not be the same as Mozilla. I ended up using 1*1 spacer images, to bump the text down. You could work around the IE problem by having the same color behind the div tag, and the same color as the div tag. I did not want this and had to use a spacer.
    "A nerd who gets contacts
    and a trendy hair cut is still a nerd"

    - Stephen Colbert on Apple Users

  5. #5
    SitePoint Zealot DrkFusion's Avatar
    Join Date
    Jan 2003
    Location
    Canada
    Posts
    118
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thank You!

  6. #6
    SitePoint Enthusiast DFS's Avatar
    Join Date
    Sep 2002
    Location
    The Wilds of Northern Maine
    Posts
    54
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    If you have to use spacer .gif's though, you're no longer keeping presentation apart from content. You can avoid this by adding the padding to the inner element instead of the containing block that has it's height defined. If you can't do that, then you can restate the height for Mozilla with the html>body selector (which IE can't read) ala the box model hack.


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
  •