Seite zentrieren?

Yiv · 11/25/2012, 17:50

Hallo liebe Elitepvpers-Community,

ich habe ein Problem mit meiner Homepage...

HTML Code:

<body>
	<div id="header"></div>
	<div id="nav-bar">
		<a class="home" href="index.html"></a>
		<a class="inst" href="#"></a>
		<a class="regi" href="regi.html"></a>
		<a class="login" href="login.html"></a>
	</div>
	<div id="content"></div>
	<div id="footer">© by <a href="http://www.dream-games.org/">Dream-Games</a><br />All rights reserved 2012!</div>
</body>

Wie kann ich die Homepage zentrieren?

HTML Code:

<body align="center">

oder

HTML Code:

<div align="center">

funktioniert nicht...

Die Bilder sind in CSS festgelegt (Größe etc.)

MfG

boxxiebabee · 11/25/2012, 20:03

Code:

<body>
<div id="wrapper" style="width: 960px; margin: 0 auto;">
	<div id="header"></div>
	<div id="nav-bar">
		<a class="home" href="index.html"></a>
		<a class="inst" href="#"></a>
		<a class="regi" href="regi.html"></a>
		<a class="login" href="login.html"></a>
	</div>
	<div id="content"></div>
	<div id="footer">© by <a href="http://www.dream-games.org/">Dream-Games</a><br />All rights reserved 2012!</div>
</div>
</body>

Jonas_93 · 11/26/2012, 08:11

"<center>" ?

Horrorkid12 · 11/26/2012, 09:27

Zwar nicht die elleganteste Lösung aber sollte funktionieren.

<body>
<div id="wrapper" style="margin-left: auto; margin-right: auto; width: 960px;">
<div id="header"></div>
<div id="nav-bar">
<a class="home" href="index.html"></a>
<a class="inst" href="#"></a>
<a class="regi" href="regi.html"></a>
<a class="login" href="login.html"></a>
</div>
<div id="content"></div>
<div id="footer">© by <a href="http://www.dream-games.org/">Dream-Games</a><br />All rights reserved 2012!</div>
</div>
</body>

NotEnoughForYou · 11/26/2012, 11:22

Quote:

Originally Posted by Jonas_93

"<center>" ?

Schlechter stil und veraltet.

~~xExtension~~ · 11/27/2012, 15:33

Quote:

Originally Posted by NotEnoughForYou

Schlechter stil und veraltet.

So machen es die Jenigen die keine Ahnung von css haben...

UserIsGrateful · 11/27/2012, 22:37

@Perση

Warum möchtest du überhaupt den style über HTML statt CSS festlegen, obwohl du schreibst das die Bilder in CSS file festgelegt sind?

boxxiebabee's Variante mit dem wrapper div ist wohl am schnellsten und einfachsten gemacht und leicht umsetzbar! Meine Empfehlung noch dazu, dass du dir bei SELFHTML oder ähnlichen, die Möglichkeiten von "margin" einmal anschaust.

1. Knackpunkt ist margin: 0px auto; und width: 960px;
2. Grundlegender Aufbau der CSS-Datei sollte bereits im body mit margin und width gearbeitet werden, dann einzeln definieren - für deine Bereiche.

Lass uns doch bitte wissen, ob es so ausreichend funktioniert oder du noch weitere Fragen hast

.

Steini00 · 11/27/2012, 23:44

Quote:

Originally Posted by xExtension

So machen es die Jenigen die keine Ahnung von css haben...

Danke. Ich habe mich wirklich 100 mal gefragt, welchen Sinn sein Beitrag hatte. Jetzt weiß ich, dass er keinen hat und nicht nur ich das so sehe

Yiv · 11/28/2012, 14:10

Heißt das nicht einfach

HTML Code:

<body>
<div id="wrapper" style="width: 960px; margin: 0 auto;">
	<div id="header"></div>
	<div id="nav-bar">
		<a class="home" href="index.html"></a>
		<a class="inst" href="#"></a>
		<a class="regi" href="regi.html"></a>
		<a class="login" href="login.html"></a>
	</div>
	<div id="content"></div>
	<div id="footer">© by <a href="http://www.dream-games.org/">Dream-Games</a><br />All rights reserved 2012!</div>
</div>
</body>

dass die Seite um 960px nach rechts verschoben wird?

boxxiebabee · 11/28/2012, 14:36

Quote:

Originally Posted by Perση

Heißt das nicht einfach

HTML Code:

<body>
<div id="wrapper" style="width: 960px; margin: 0 auto;">
	<div id="header"></div>
	<div id="nav-bar">
		<a class="home" href="index.html"></a>
		<a class="inst" href="#"></a>
		<a class="regi" href="regi.html"></a>
		<a class="login" href="login.html"></a>
	</div>
	<div id="content"></div>
	<div id="footer">© by <a href="http://www.dream-games.org/">Dream-Games</a><br />All rights reserved 2012!</div>
</div>
</body>

dass die Seite um 960px nach rechts verschoben wird?

Nein.. 960px ist die maximale Weite vom Content / alles was da drin ist. Und Mit margin: 0 auto; zentrierst du das ganze, dafür braucht man halt ne definierte Weite.

NotEnoughForYou · 11/28/2012, 14:37

Quote:

Originally Posted by Steini00

Danke. Ich habe mich wirklich 100 mal gefragt, welchen Sinn sein Beitrag hatte. Jetzt weiß ich, dass er keinen hat und nicht nur ich das so sehe

Wieso ? Mein Beitrag sollte ausdruecken, dass man <center> nicht nutzen soll so wie von Jonas_93 virgeschlagen

Zettabytes* · 11/29/2012, 08:45

<center> nutzt man nicht mehr weil es Deprecated ist. Wenn du es benutzt dann ist das Falsch, ganz einfach. Da gibt es kein aber. Wir haben nicht umsonst das W3C.

Jonas_93 · 11/29/2012, 12:59

Quote:

Originally Posted by xExtension

So machen es die Jenigen die keine Ahnung von css haben...

Oder Anfänger, die nur ein Ergebnis sehen wollen?
Den "<center"> tag wirst du in jedem anfängerfreundlichen Tutorial finden, egal wie gut oder schlecht es ist.
Du hast ja schließlich auch nicht mit der jQuery-Syntax angefangen JS zu programmieren.

boxxiebabee · 11/29/2012, 13:17

Quote:

Originally Posted by Jonas_93

Du hast ja schließlich auch nicht mit der jQuery-Syntax angefangen JS zu programmieren.

Ach.. ich hab da schon ein paar Kandidaten gesehen die das so gemacht haben. Dementsprechend ist auch deren Stil.

Zettabytes* · 11/29/2012, 14:06

Quote:

Originally Posted by Jonas_93

Oder Anfänger, die nur ein Ergebnis sehen wollen?
Den "<center"> tag wirst du in jedem anfängerfreundlichen Tutorial finden, egal wie gut oder schlecht es ist.
Du hast ja schließlich auch nicht mit der jQuery-Syntax angefangen JS zu programmieren.

Hab ich noch nie gesehen!

Doch hab ich.