I'm trying to set a fixed navigation menu on a liquid layout, whereby the list items have a margin-left: 25% The problem I'm encountering is the links (list items) become un-clickable.

However if I do any of the following, the links begin to work again:
1. remove "position: fixed" from "nav ul" (can't, needs to be fixed)
2. specify "px" instead of "%" for margin-left under "nav ul li a" (can't, needs to be liquid in width)
3. remove "position: relative" from next container div in the HTML (can't, it uses z-index)

  <nav>
  <ul>
      <li><a href="/index.html">HOME</a></li>
      <li><a href="/story.html">STORY</a></li>
      <li class="active"><a href="/rekha.html">SERVICES</a></li>
      <li><a href="/salons.html">SALONS</a></li>
  </ul>

      nav {
}
nav ul {
  width: 100%;
  position: fixed;
}
nav ul li {
  height: 18px;
  margin: 4px 0;
}
nav ul li a {
  font-size: 1.8em;
  font-weight: bold;
  margin-left: 25%;
}