Question

I have unordered list navigation like this. When anchor is hovered navigation list moves 1px left.
How to fix that ?

Here is my code

<ul id="nav">
  <li><a href="#">First</a></li>
  <li><a href="#">Second</a></li>
  <li><a href="#">Third</a></li>
</li>

Here is my css:

ul#nav li {
    float: left;
    margin: 0; padding: 0;
}

ul#nav li a:hover {
    -moz-border-radius:3px;
    border: 1px solid #ccc;
}

Answer 1

Try:

ul#nav li a {
    border: 1px solid transparent;
}

ul#nav li a:hover {
    -moz-border-radius:3px
    border:1px solid #cc
}