[HTML/CSS] DIV zentrieren ohne "align"

hurga_gonzales · 2. August 2005

Hi,

kann ich ein DIV zentrieren, OHNE "align" zu verwenden? Ich würde es gerne mittels Style zentrieren. Das Div muss dabei skalierbar bleiben bis 800x600 px.

Danke
Hurga

Saschlong · 2. August 2005

Im Normalfall mit

Code:

margin: auto auto;

erster Wert oben/unten, zweiter Wert links/rechts.

Da guggen --> http://css4you.de <-- sehr schick!

syntec · 2. August 2005

Mach doch einfach <div style="margin: auto">...

Edit: zu spät

hurga_gonzales · 2. August 2005

Maaannnn BRETT VORM KOPP - danke klar.

Ich brauch Urlaub.

Bis denn
Hurga

hurga_gonzales · 2. August 2005

Ok, haltet Euch fest:

position: absolute; top: 300px; width: 980px; height: 100%; padding: 0px; margin: auto;

Der IE zentriert den Inhalt - der Firefox und Netscaope legen den Inhalt links an.

Wie kann ich das lösen?

Danke
Hurga

PuppetMaster · 2. August 2005

AW: [HTML] Firefox und Netscape zentrieren nicht

Dem Inhalt ein margin: auto; zuweisen?

Sgt_H4rtman · 2. August 2005

hurga_gonzales schrieb:
Ok, haltet Euch fest:

position: absolute; top: 300px; width: 980px; height: 100%; padding: 0px; margin: auto;

Der IE zentriert den Inhalt - der Firefox und Netscaope legen den Inhalt links an.

Wie kann ich das lösen?

Danke
Hurga

Ganz einfach. Ergänze deine Stylesheet-Angabe mit text-align:center wenn Du es in der Mitte haben willst.

Ciao

HoRnominatoR · 2. August 2005

oder verwende einfach einen vernuenftigen doctype wie xhtml 1.0 strict.

usb2.0 · 3. August 2005

und jetzt nochmal alles zusammen:

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de" lang="de">
    <head>
        <title></title>
	    <style type="text/css">
	        body{
	            text-align:center; // Für den IE
		}

		div#kontainer{
		    text-align:left;
		    width:720px;
		    margin:0 auto;
		}
	</style>
    </head>
    <body>
        <div id="kontainer">
	    <p>Lorem ipsum</p>
	</div>
    </body>
</html>

hurga_gonzales · 3. August 2005

Hi,

das mag mit Euren normalen DIVs ganz gut hinhaun, aber bei einem DIV mit "position: absolute;" kann der FF scheinbar nix mit "margin: auto" anfangen, wobei der IE, man höre und staune, es richtig anzeigt (auch ohne text-align: center).

Gibt es eine andere Lösung.
Ich muss den Inhalt aus Suchmaschinengründen über der Navigation im Quellcode anzeigen. Nach außen hin befindet sich der Inhalt natürlich unter der Navigation. Das ist nur mit absoluter Position des Inhaltsbereiches machbar.

Danke
Hurga

hurga_gonzales · 3. August 2005

Die Lösung lautet:

HTML:

body { FONT-FAMILY: tahoma,arial; COLOR: #4C4C4C; FONT-SIZE: .7em; line-height: 1.4em; margin: 0px auto; padding: 0px; width: 980px; }
.maincontent { position: absolute; top: 300px; width: 980px; height: 100%; padding: 0px; margin: auto; }

<div class="maincontent">Inhalt der Webseiten</div>
<div>
Navigation
</div>

So wird die Navigation im Quellcode UNTER dem Inhalt angezeigt. Suchmaschinen erhalten zuerst den Inhalt, der die Schlüsselwörter und Überschriten (H-Tags) enthalten muss.

Getestet in:
Netscape 7
IE6
FF 1.0.6

Bis dann
Hurga

Suche

hurga_gonzales

Captain

Saschlong

Lt. Junior Grade

syntec

Lt. Commander

hurga_gonzales

Captain

hurga_gonzales

Captain

PuppetMaster

Admiral Pro

Sgt_H4rtman

Ensign

HoRnominatoR

Lt. Junior Grade

usb2.0

Cadet 1st Year

hurga_gonzales

Captain

hurga_gonzales

Captain

Ähnliche Themen