Question

Bellow is what I try to achieve

|                                 link | link | link             a,b,c search:  |

the link-link-link are centered, the a,b,c search is floated to the right.
I try to achieve this using the simplest CSS+HTML

What I have:

<header>
<nav><a href="aaa">fff</a> | <a href="aaa">fff</a> | <a href="aaa">fff</a></nav>
<ul><li>a</li><li>b</li><li>c</li><li>search: </li></ul>
</header>

I have text-align: center on the header.
I have display:block; float: right on the ul

Which almost gives me the right thing, except the UL is one line below…
I can solve this by giving negative margin-top to the ul.

Wondering if there is better solution.

Answer 1

The simplest way: position: absolute; top: 0; right: 0; on the <ul>