Zentrierung von CSS-HTML-Schaltflächen ⇐ HTML

[Guest]

Ich habe eine Menge Nachforschungen zu diesem Thema angestellt und kann keine Antwort darauf finden, wie ich das Problem beheben kann. Fangen wir an.

Ich habe 2 Menüs und ein Bild (Sie können das Format in der jFiddle sehen). Ich möchte die Menüs zentrieren. Nun ja, ich weiß, dass dies normalerweise einfach ist, aber ich habe eine Reihe normaler Abhilfemaßnahmen ausprobiert, darunter Rand, Position und Polsterung. Bitte helfen Sie mir. Sie können mit der jFiddle herumspielen, indem Sie den untenstehenden Link verwenden. Danke.

http://jsfiddle.net/7mXPy/1

Wichtiges CSS

Code: Select all

#nav3 {
width: 100%;
float: left;
margin: 0 0 1em 0;
padding: 0;
background-color: #f2f2f2;
border-bottom: 1px solid #ccc;
text-align: center;
vertical-align: text-top;
}

#nav3 ul {
list-style: none;
width: 100%;
margin: 0 auto;
padding: 0;
}

#nav3 li a {
display: block;
padding: 8px 15px;
text-decoration: none;
font-weight: bold;
color: #069;
border-left: 1px solid #ccc;
vertical-align: super;
margin: 10%;
}

Wichtiges HTML

Code: Select all

[list]
[*][url=#]Home[/url]
 [*][url=#]Logout[/url]  [*][url=#]Login[/url]
[*][url=#]Signup[/url]

[/list]

[img]includes/logo/diagram_v2_22.png[/img]

[list]
[*][url=#]XBOX360[/url]
[*][url=#]XBOX1[/url]
[*][url=#]PS3[/url]
[*][url=#]PS4[/url]
[/list]