Title: CSS Help: Nav Bar
Last modified: August 18, 2016

---

# CSS Help: Nav Bar

 *  [Raquel Wilson](https://wordpress.org/support/users/belindasuperstarr/)
 * (@belindasuperstarr)
 * [19 years, 4 months ago](https://wordpress.org/support/topic/css-help-nav-bar/)
 * I’m looking at the code and the CSS and I can’t quite figure out what’s wrong
   with the navbar on [this site](http://www.vergeculture.com).
 * A second pair of eyes would be great.
 * The logo image should be a link, but not have a background color on mouseover.
   Also, the text for “current issue” should be aligned with the other text.
 * The CSS code for the navigation is:
 *     ```
       ul#nav { list-style: none; width: 650px; padding: 0 0 90px 0; float: left; clear: both; }
   
       ul#nav li { padding: 0 10px 0 0; font: bold 1.4em Helvetica, Arial, sans-serif; text-transform: uppercase; float: left; }
   
       ul#nav li a, ul#nav li a:visited { display: block; height: 3.0em; padding: 0 1.2em; line-height: 3.0em; color: #fff; text-decoration: none; background: #141415; }
   
       ul#nav li a:hover { color: #fff; background: #434220; text-decoration: none; }
   
       ul#nav li a.current, ul#nav li a.current:visited, ul#nav li a.current:hover { color: #090; text-decoration: underline; }
       ```
   
 * The HTML for the navbar is:
 *     ```
       <ul id="nav">
       		<li><a href="<?php bloginfo('url'); ?>"><img src="<?php bloginfo('template_url'); ?>/images/logo.gif" width="215" height="87" alt="<?php bloginfo('name'); ?> </a></li>
                      <li><a href="<?php bloginfo('url'); ?>/current/">current issue</a></li>
       		<li><a href="<?php bloginfo('url'); ?>/archives/">archives</a></li>
       		<li><a href="<?php bloginfo('url'); ?>/sign-up/">sign-up</a></li>
   
       	</ul>
       ```
   
 * I’ve been trying to find the problem a couple days now so any help is greatly
   appreciated.

Viewing 1 replies (of 1 total)

 *  [antod](https://wordpress.org/support/users/antod/)
 * (@antod)
 * [19 years, 4 months ago](https://wordpress.org/support/topic/css-help-nav-bar/#post-524526)
 * I’m no expert but I think you need to stop the highlighting appearing when you
   mouseover the image.
 * Your CSS, creates a background colour when you rollover any link in the menu –
   this includes an image.
 * Plus the code for the link/image is all over the place.
 *     ```
       <a href="http://www.vergeculture.com">
       <img width="215" height="87" http://www.vergeculture.com/current=""
       alt="Taste Magazine </a></li> <li>
       <a href=" src="http://www.vergeculture.com/wp/wp-content/themes/Cutline 1.1/images/logo.gif"/>
       current issue
       </a>
       ```
   
 * There is an inside the <img> tag. It looks like you need to close the image tag
   first.
 * Hope that’s of some help.

Viewing 1 replies (of 1 total)

The topic ‘CSS Help: Nav Bar’ is closed to new replies.

## Tags

 * [list](https://wordpress.org/support/topic-tag/list/)
 * [nav bar](https://wordpress.org/support/topic-tag/nav-bar/)

 * 1 reply
 * 2 participants
 * Last reply from: [antod](https://wordpress.org/support/users/antod/)
 * Last activity: [19 years, 4 months ago](https://wordpress.org/support/topic/css-help-nav-bar/#post-524526)
 * Status: not resolved

## Topics

### Topics with no replies

### Non-support topics

### Resolved topics

### Unresolved topics

### All topics