The following code docks a <h1> element to the left of the navigation and all <a> elements to the right of the navigation. It displays correctly in Internet Explorer 6 on up, but I cannot guarantee anything before that.

HTML:
HTML Code:
<ul class="navigation">
  <li><h1>Logo</h1></li>
  <li>
    <ul>
      <li><a href="#bg-1">Link 1</a></li>
      <li><a href="#bg-2">Link 2</a></li>
      <li><a href="#bg-3">Link 3</a></li>
      <li><a href="#bg-4">Link 4</a></li>
    </ul>
  </li>
</ul>
CSS:
Code:
ul.navigation {
  color: #777;
  list-style-type: none;
  margin: 0;
  padding: .75em .25em;
  width: 100%;
}

ul.navigation li {
  display: inline;
  line-height: 2em;
  margin: 0;
  padding: 0;
}

ul.navigation h1 {display: inline;}

ul.navigation ul {
  display: inline;
  float: right;
}

ul.navigation a {
  color: inherit;
  font-size: 1.25em;
  padding: 0 .25em;
  text-decoration: none;
}

ul.navigation a:hover {color: #0074D9;}
Fiddle: http://codepen.io/anon/pen/VmoxwR

When put through the W3 Validation Service, it is successfully checked as XHTML 1.0 Strict.