Wyśrodkowanie menu

wersja skryptu MyBB: 1.6.9
adres forum: www.truckheaven.xaa.pl
na czym polega problem (screen, opis, komunikaty, nazwa stylu/theme/szablonu):

Mam coś takiego:

    <div style="height: 45px; background: url({$theme['imgdir']}/bar1.png) top center no-repeat; width: 100%; border-bottom: #505050; font-family: arial; font-size: 13px; color: white;">
    <ul id="nav">
       <li><a href="{$mybb->settings['bburl']}/index.php">Strona Główna</a></li>
       <li><a href="{$mybb->settings['bburl']}/memberlist.php">Gracze</a></li>
       </ul>
       </div>

I chciał bym wyśrodkować te 2 buttony.

Matslom napisał 06.04.2013, 12:13:
Poprawiłem tytuł.

Ale klase robisz w globa.css nadajesz jej nazwę np. .przycisk i tam uzupełniasz ją jak chcesz
( w twoim wypadku by to tak wyglądało :

.przycisk {
height: 45px;
background: url({$theme['imgdir']}/bar1.png) top center no-repeat;
width: 100%;
border-bottom: #505050; f
ont-family: arial;
font-size: 13px;
color: white;
}

)

i potem dajesz <div class="przycisk"> ... </div> (pomogło ?)

Znalazłem jeszcze coś takiego:

#nav {
    margin: 0 0 3em 0;
    padding: 8px;
        padding-left: 20px;
    list-style: none;
        background: transparent;
        float: left;
}


#nav li {
    float: left;
}

#nav li a {
    display: block;
    padding: 5px 13px;
    text-decoration: none;
    color: #b8b8b8;
        font-family: arial;
        font-size: 13px;
}
#nav li a:hover {
    color: #b8b8b8;
    background: #1b1b1b;
        -moz-border-radius: 5px 5px 5px 5px;
        -webkit-border-radius: 5px 5px 5px 5px;
        -khtml-border-radius: 5px 5px 5px 5px;
}

Czyli klasa już jest przypisana tylko którą zmodyfikować żeby zmienić pozycje?

#nav {
    margin: 0 0 3em 0;
    padding: 8px;
        padding-left: 20px;
    list-style: none;
        background: transparent;
        float: center;
}

Daje float center w #nav to jedynie przenosi mi buttona linijkę niżej, dałem jeszcze center w #nav li i co prawda wyśrodkowało mi jednak wygląda to tak:



Pasek rozciąga się na całą stronę a drugi przycisk się chowa na dole.

Nie ma czegoś takiego jak float: center

Spróbuj to :

#nav {
    margin: 0 0 3em 0;
    padding: 8px;
    list-style: none;
        background: transparent;
        float: left;
}

#nav {
display: inline;
background: transparent;
margin: 0px auto;
}

Nie widać tego na forum to trudno dostosować.

Dodałem tak:

margin-left: 190px;
margin-top:0px;

I teraz mi wrzuciło te przyciski na pasek tylko czy nie będzie w przyszłości jakiś problemów z rozdzielczością itd?

Dałeś margin-left: 190px czyli ustawiłeś na stałe.
Sorry, ale nie widać tego na forum i nie ma jak Ci pomóc. Zgadywać nie będę.

http://www.truckheaven.xaa.pl/

Nie widać tego?

Teraz mam problem ponieważ na 22 celowym monitorze PC wyświetla mi to idealnie jednak na 15" netbooka przyciski zmieniają już położenie.

---

Wygląda to mnie wiecej tak.
W zależności od rozdzielczości wyświetlanej strony forum zmienia wielkość jednak przyciski pozostają bez ruchu.

22 Cale:


15 Cali:

To w końcu chcesz, aby były na środku strony, czy po lewej stronie?

On chce to wyśrodkować i żeby się nie zmieniało jeśli chodzi o szerokość ekranu (rozdzielczość). Ma być w każdym przypadku na środku tego ciemniejszego niebieskiego.

Próbowałem zrobić, ale mi nie wychodzi.
Tam <div> jest ustawiony na width 100% w style inline
i nie wiem jak wyśrodkować ten <ul> w css

W szablony -> nagłówek -> header -> znajdź to

<div style="height: 45px; background: url(images/sweetdreams/bar1.png) top center no-repeat; width: 100%; border-bottom: #505050; font-family: arial; font-size: 13px; color: white;">

Zamień na

<div style="height: 45px; background: url(images/sweetdreams/bar1.png) top center no-repeat; width: 939px; margin: 0 auto; border-bottom: #505050; font-family: arial; font-size: 13px; color: white;">

Znajdź element w global. css #nav i zamień go na to

#nav {
margin: 0 auto;
list-style: none;
padding: 8px 0 8px 0;
background: transparent;
text-align: center;
width: 200px;
}