SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    SitePoint Member
    Join Date
    Mar 2009
    Posts
    4
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Some CSS help regarding text and cross-browser comp

    This seems like it should be such a simple fix, but I cannot for the life of me figure out why IE keeps putting tons of space on top/bottom of my links. I've attached images (please keep in mind, I'm somewhat of a noob with CSS but am trying): Nevermind, can't add pics cause I just joined.

    To give you an idea, FF shows my text how I like it...close together. IE spaces my list (it's vertical) with enough room to fit two more text lines...if that makes sense?

    I've included the CSS instead. Any help is appreciated.

    #sidenavigation {
    float: left;
    width: 160px;
    height: 76%;
    padding: 1em 1em 0 1em;
    background-color: #EEEEEE;
    border-right: 1px dashed #DDDDDD;
    }
    #sidenavigation ul {
    list-style: none;
    margin: 0;
    padding: 0;
    font-size: 10px;
    border: none;
    }
    #sidenavigation a:link, #sidenavigation a:visited {
    color: #000000;
    background-color: transparent;
    display: block;
    padding: .2em 0 .2em 0;
    text-decoration: none;
    }
    #sidenavigation a:hover {
    color: #FFFFFF;
    background-color: #3398CC;
    }

  2. #2
    Design Your Site Team bronze trophy Erik J's Avatar
    Join Date
    May 2007
    Location
    Countryside, Sweden
    Posts
    3,407
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hi dainteeone, welcome to SitePoint!

    Try floating the li (with full width for the link block) to kill the white space:
    Code:
    #sidenavigation {
    float: left;
    width: 160px;
    height: 76%;
    padding: 1em 1em 0 1em;
    background-color: #EEEEEE;
    border-right: 1px dashed #DDDDDD;
    }
    #sidenavigation ul {
    list-style: none;
    margin: 0;
    padding: 0;
    font-size: 10px;
    border: none;
    }
    #sidenavigation li {
    float: left;
    width: 160px;
    }
    #sidenavigation a:link, #sidenavigation a:visited {
    color: #000000;
    background-color: transparent;
    display: block;
    padding: .2em 0 .2em 0;
    text-decoration: none;
    }
    #sidenavigation a:hover {
    color: #FFFFFF;
    background-color: #3398CC;
    }
    Happy ADD/ADHD with Asperger's

  3. #3
    SitePoint Member
    Join Date
    Mar 2009
    Posts
    4
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks for the warm welcome and the help erik! I'm going to give it a try when I get home. I appreciate it!


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
  •