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 3 of 3
  1. #1
    Regular Coder
    Join Date
    Mar 2007
    Posts
    120
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Block Elements Inline

    Hey,
    I'm doing a nav bar that is made up of css image rollovers but I'm having a problem making them inline in Firefox. If I use inline-block, firefox doesn't work, Safari does. If I just use block, they are not inline. What is a way around this? Do I have to use a <ul>? Here's my code:

    HTML:
    Code:
    <a href="#" class="about">About</a>
    <a href="#" class="news">News</a>
    ...etc.
    CSS:
    Code:
    a.about {
    height:24px;
    width:74px;
    overflow:hidden;
    background:url(about.png) top left no-repeat;
    display:inline-block;
    text-indent:-5000px;
    }
     
    a.about:hover{
    background-position: bottom left;
    }
    
    a.news {
    height:24px;
    width:70px;
    overflow:hidden;
    background:url(news.png) top left no-repeat;
    display:inline-block;
    text-indent:-5000px;
    }
     
    a.news:hover{
    background-position: bottom left;
    }
    
    ...etc.
    site's here:
    http://homepages.nyu.edu/~mlm440/thissideup3/

  • #2
    Senior Coder
    Join Date
    Aug 2002
    Location
    Kansas City, Kansas
    Posts
    1,518
    Thanks
    0
    Thanked 2 Times in 2 Posts
    I'd just float them. If you're making a navbar, I'd also use a list as it makes more sense semantically. Check out http://css.maxdesign.com.au/floatutorial/.

  • #3
    Regular Coder
    Join Date
    Mar 2007
    Posts
    120
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Thanks for the quick help...must have had a brain fart, can't believe I forgot to float. Worked great though! Now it's all fixed.


  •  

    Posting Permissions

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