Как задать позицию элементов в шапке сайта?

Question

[dflbrhekbn]

Как задать позицию элементов находящихся в шапке сайта : Главная, Правила, Контакты и строка поиска.

что бы они имели вид как на рисунке ниже

Comments

[dflbrhekbn]

Насколько я понял это код для их редактирования (styles.css) :
/*---headlinks---*/
.headlinks ul, .searchbar {
display: inline-block;
float: right;
margin-top: 37px;
}

.headlinks ul a {
padding: 0 10px;
height: 27px;
color: #516168;
font: 1.15em/26px sans-serif;
float: left;
}

.headlinks ul a:hover {
color: #fff;
background-color: #96c;
}

Answer 1

[Иван Козлов]

Вариантов куча. Покажите исходники.

Comments

[dflbrhekbn]

Насколько могут судить, то исходник вот :
/*---headlinks---*/
.headlinks ul, .searchbar {
display: inline-block;
float: right;
margin-top: 37px;
}

.headlinks ul a {
padding: 0 10px;
height: 27px;
color: #516168;
font: 1.15em/26px sans-serif;
float: left;
}

[dflbrhekbn]

И еще, если с первой строчки я удаляю ".searchbar" , то все эти элементы перемещаются в левый угол шапки сайта.
Вот год этого ".searchbar" :
/*---search---*/
.searchbar {
margin-left: 5px;
width: 182px;
height: 27px;
background: url("../images/search.png") no-repeat;
}

.searchbar li {
float: left;
height: 27px;
}

.searchbar .lfield {
width: 145px;
padding-left: 10px;
overflow: hidden;
}

.searchbar .lfield input {
color: #708893;
float: left;
height: 15px;
width: 145px;
border: 0 none;
background: #fff;
margin-top: 6px;
}

.searchbar .lbtn input {
width: 27px;
height: 27px;
background: url("../images/search.png") no-repeat 0 -27px;
}

.searchbar .lbtn input:hover {
background-position: -27px -27px;
}