SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    SitePoint Member
    Join Date
    Jan 2005
    Location
    Dallas, TX
    Posts
    5
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Help with Browser Compatibility

    I am designing my website using css and xhtml. It looks great in IE6 but it looks different in other browsers. The links get cut off from the div on the bottom, but they are still clickable.

    I am not sure how to fix this. Any suggestions?

    Here is my code with the problem-


    .top {
    position:absolute;
    height:25px;
    width:638px;
    top:135px;
    left:60px;
    background-color:#000000;
    }

    .nav{
    position:absolute;
    top:2px;
    color:#FFFFFF;
    font-family:Arial;
    font-weight:bold;
    font-size:16px
    }



    <div class="top">
    <p class="nav" style="left:40px;"><a href="link1.html">Link 1</a></p>
    <p class="nav" style="left:156px;"><a href="link2.html">Link 2</a></p>
    <p class="nav" style="left:300px;"><a href="link3.html">Link 3</a></p>
    <p class="nav" style="left:466px; "><a href="link4.html">Link 4</a></p>
    </div>

  2. #2
    Non-Member Egor's Avatar
    Join Date
    Jan 2004
    Location
    Melbourne, Australia
    Posts
    7,305
    Mentioned
    1 Post(s)
    Tagged
    1 Thread(s)
    Code:
    .nav{
    color:#FFFFFF;
    font-family:Arial;
    font-weight:bold;
    font-size:16px;
    margin: 2px 10px 0 0;
    float: left;
    }
    
    .nav a {
    display: block;
    float: left;
    }
    Try that. Adjust the margins on .nav to suit.

  3. #3
    SitePoint Member
    Join Date
    Jan 2005
    Location
    Dallas, TX
    Posts
    5
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks, that fixed the problem.


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
  •