Jak wyśrodkować menu poziome (CSS)

Witam!

Mam pytanie jak wyśrodkować menu poziome w css, ponieważ gdy nadam polecenie float: left, menu jest poziome, lecz gdy zmienie na float: center, przerzuci się na środek lecz, robi się pionowe.

Float nadajesz dla obiektów menu, wyśrodkować możesz poprzez “margin: 0 auto;” zadeklarowanym rodzicowi, który powinien mięć określoną szerokość.

Mój kod:

Mógłbyś powiedzieć gdzie to zmienić?

#menu ul { list-style-type: none; margin: 0 auto; width: suma_szerokości_potomków;}

#menu li { margin: 0 0 .2em 0; float: left;}

#menu a { display: block; color: #FFF; background-color: #036; width: 9em; padding: .5em .8em; text-decoration: none; text-align: center;}

#menu a:hover{ background-color: #369; color: #FFF; }

Za “suma_szerokości_potomków” podaj odpowiednią wartość (nadałeś dla “a” szerokość 9em + 1.6em -suma lewego i prawego 0.8 dopełnienia-, czyli 10.6em x liczba elementów w menu).

Wyśrodkowało się, lecz wciąż robi się pionowe :frowning:

No to gdzieś masz błąd lub inny obiekt powoduje problem, przykład (z dwoma elementami menu, menu o szerokości 21,2em).

Dziękuję ci dobry człowieku :slight_smile:

A w jaki sposób mogę teraz nadać rozmiar (szerokość) stronie?

Szerokość Twojej strony znajduje się w #container {width: 1000px; margin: 0 auto;}, ale jak będziesz ją zmniejszać lub zwiększać, zajmij się też szerokościami w:

#sideleft {width: 700px; float: left;}

#sideright {width: 300px; float: left; font-family: Courier New; font-size: 12px;}

Poza tym jeżeli dodasz ramkę dla tych obiektów, odejmij od ich szerokości, szerokość tej ramki (border lewy i prawy razy dwa).

A i jeszcze jedno, jak będziesz dodawał jakiś obiekt pod lewym i prawym panelem (np. stopę), wklej przed nim

(jest on w kodzie strony…), jest on po to by likwidować działanie float’u obiektów go poprzedzających.

Czy w owym

trzeba coś wpisywać, czy zostawić pusty, i dodawać obiekt/y?

Zostawiasz pusty, tak jak ten za “menu” i przed “content”.

W pliku HTML menu wstaw w znaczniki

menu