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
    New Coder
    Join Date
    Jul 2005
    Posts
    29
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Hovers On Inline Styles?

    Morning All

    I've been working on the horizontal menu on the following page.

    http://www.ja.net/temp/Project/assets/index.html

    I have a background image that runs off the 'ul a' tag, here's the css.
    <style>
    .nav ul a {
    padding: 0 5.4em;
    line-height: 1.8em;
    text-decoration: none;
    float: left;
    display: block;
    color: #e7e3d9;
    border: none;
    background: url(nav-bg.gif) no-repeat bottom right;
    }
    </style>

    I do not want the image to appear on the last item on the right hand side, so I've added an inline style.

    The html looks like this
    <style>
    <div class="nav">
    <ul>
    <li><a href="#">Support</a></li>
    <li><a href="#">Services</a></li>
    <li><a href="#">Developments</a></li>
    <li style="font-family:Arial, Helvetica, sans-serif;
    font-size: 1em;
    font-weight:bold; background:none;"><li
    ><a href="#" style="padding: 0 5.4em;
    line-height: 1.8em;
    background:none;
    text-decoration: none;
    float: left;
    display: block;
    color: #e7e3d9;
    border: none;
    ">Technologies</a></li>
    </ul>
    </div>
    </style>

    However, in doing so, the hover css is no longer applied. I've played around with creating a second style for this li item, and adding the hover stylings to the inline li item, but nothing seems to have worked.

    Does anyone have any ideas? Basically, I want a hover to appear on the final sub nav item, but not the background image

    Thanks very much for any help, its greatly appreciated
    durdledoor
    Last edited by durdledoor; 10-19-2007 at 10:54 AM.

  • #2
    Regular Coder
    Join Date
    Jun 2004
    Posts
    495
    Thanks
    0
    Thanked 82 Times in 80 Posts
    Code:
    <li><a href="#" style="background-image:none;">Technologies</a></li>

  • Users who have thanked Fang for this post:

    durdledoor (10-19-2007)

  • #3
    New Coder
    Join Date
    Jul 2005
    Posts
    29
    Thanks
    1
    Thanked 0 Times in 0 Posts
    Thanks a lot mate, that has done the job, was a really simple solution in the end!


  •  

    Posting Permissions

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