DIV isn't working

[McStormify]

For my drop down menu, this is the HTML

 <li> <div class="test"> <a href="http://hybridheaven.uzrhosting.com/contact.php">Contact Us</a></div></li>

this is the CSS:

.test {
border-bottom: 1px solid #646464;
}

.test:hover {
background-color: #fff;
}

.test a:hover {
background-color: #fff;
}

The background color on hover isn't showing up.

 

[Cafetin]

Did you tried using a <span class="test"> instead of <div class="test">?

Also I would need some more of the html and possibly the whole css related to this to spot it faster.

 

[Saxaca]

Try this DOM:

<ul>
  <li><span class="test"><a href="http://hybridheaven.uzrhosting.com/contact.php">Contact Us</a></div></li>
</ul>

<style>
.test {
  border-bottom: 1px solid #646464;
  background-color: #000;
  padding: 5px;
  }

.test:hover {
  background-color: #fff;
  }

.test a:hover {
  background-color: #fff;
  }
</style>

Div's in lists will result in something very.. croppy. Use span, so it won't be the maximum width.
The default background of a page is #FFF, I set a #000 background to default.

Good luck!