Website zentrieren

[lucy_lawless]

AW: Website zentrieren

Ganz einfach dem wrapper div "margin:0px auto; clear:both; display:block; width:800px;

Dann noch in den body width:100%; height:100%;

wozu clear:both? du hast doch vorher nix gefloatet? body width und height 100%? ist doch eh der standardwert. ist genau wie display:block unnötig. mag sein, dass das dann so auch in nicht richtig css fähigen browsern funktioniert, ist aber völlig schwachsinniges css.

mir ists dann lieber für die kaputten browser in ner extrazeile text-align:center zu setzen und die seite für moderne browser ganz einfach mit margin:auto zu zentrieren. ist sauberer so.

in der praxis betrifft das problem ja nur noch den ie6 und der stirbt ja auch irgendwann aus. besser lernen wies mit css richtig geht und sich bewußt machen, für welchen kaputten browser man welche fixes benutzt.

ist besser für die zukünftige arbeit als sachen "falsch" zu bearbeiten - find ich jedenfalls

 

[SiskaCCC]

AW: Website zentrieren

Leute, Leute, ihr verwirrt mich total Was ist denn jetzt der momentane Standard bzw. die sauberste Lösung? Will's ja schließlich gleich richtig lernen.

 

[Top_Gun]

AW: Website zentrieren

Leute, Leute, ihr verwirrt mich total Was ist denn jetzt der momentane Standard bzw. die sauberste Lösung? Will's ja schließlich gleich richtig lernen.

Ich kann dich gut verstehen, dass dich das fundierte Halbwissen, welches hier kundgetan wird, verwirrt.

Halt dich an die Lösung von Herr_D, der weiß wovon er spricht.

 

[feelx75]

AW: Website zentrieren

Leute, Leute, ihr verwirrt mich total Was ist denn jetzt der momentane Standard bzw. die sauberste Lösung? Will's ja schließlich gleich richtig lernen.

Hi

ohjee das wollten wir nicht... Am saubersten ist es, für die HTML-Seiten XHTML zu verwenden (XHTML 1.0 transitional) und kein Tabellen-Layout einzusetzen, sondern mittels CSS zu formatieren und zu positionieren.
Das bedeutet, dass man halt neben HTML auch CSS lernen sollte. Dies bringt einige Vorteile: Du kannst das Aussehen (Schriftarten, Hintergrundgrafiken, Abmessungen und Abstände usw) zentral im CSS für alle Seiten ändern. Weiter wird der Code übersichtlicher, weil die Struktur (Inhalte) und Formatierungen separat gelagert werden, wenn du die CSS-Datei separat lagerst.
Habe gerade folgende Seite er-googelt:
HTML lernen und die eigene Homepage erstellen - HTML lernen - HTML Kurs / Seminar
Vielleicht erleichtert dir das den Anfang - und wie gesagt, sonst zeige einfach mal, wo du stehst und was du hast, dann können wir sicher gerne gezielt helfen

 

[BigBilly]

AW: Website zentrieren

@ feelx75

Oki. Wusst ich nicht. Da ich auch den IE5 nicht berücksichtige isses dann auch ok
Aber gut zu wissen, falls ich mal doch darauf achten muss.

 

[lucy_lawless]

AW: Website zentrieren

Leute, Leute, ihr verwirrt mich total Was ist denn jetzt der momentane Standard bzw. die sauberste Lösung? Will's ja schließlich gleich richtig lernen.

Die lösung von herr_d ist die sauberste zum vertikal zentrieren (und meiner ansicht nach die einzig richtige wenn die seite oben nicht so am rand kleben soll, geb ein margin-top für den hauptcontainer an.

horizontal (falls du das auch brauchst) ist schon schwieriger und verwirrt dich wahrscheinlich nur noch mehr. falls dus brauchst sagt bescheid, dann versuch ich dir das zu erklären.

 

[SiskaCCC]

AW: Website zentrieren

Danke für das Angebot, aber das brauch ich nicht. Zumindest im Moment nicht.
Vielen Dank für deine Hilfe und auch danke an die tatkräftige Unterstüzung der anderen!
@fleex: danke auch an dich, für diesen hilfreichen Link!

 

[RSeiner]

AW: Website zentrieren

Hallöle allerseits,

wie man immer so schön sagt, viele Wege führen nach Polen.. oder war es Japan???

Ich benutze gern folgende CSS die dafür sorgt, dass ein Layout grundsätzlich zentriert dargestellt wird.:

damit ich nicht der Willkür eines jeweiligen Browsers ausgesetzt bin setze ich alle Werte auf "0"

* {
margin : 0;
padding : 0;
}Mein Layout soll sich immer in der Mitte befinden. Nehme ich den Browser und ziehe ihn in verscheidene Größen, so wird das Layout immer mittig ausgerichtet. Hier ein Bsp. am Block-Element

/*einleitender Div*/
div#layout {

/*Block- Element wird eingeleitet*/
display : block;

/*die Position soll absolut mittig ausgerichtet sein*/
position : absolute;

/*linker Abstand*/
left : 50%;

/*halbe Größe der Website*/
margin-left : -404px;

/*Element z-index: Elemente überlappen/ optische Überlappung*/
z-index : 1;

/*Breite des Layout*/
width : 809px;

/*Höhe je nach Inhaltsmenge angepasst*/
height : auto;
}

Grüsse

 

[mindraper]

AW: Website zentrieren

moinsen.

eure css-vorschläge sind ja alle gut und schön, aber was macht ihr, wenn ein element als position:absolute dargestellt werden soll mit einer fixen breite und immer zentriert?

selbst wenn ich da ein container-div drumsetze und dem den wert position:relative gebe, funzt die sache mit dem margin: 0 auto; nämlich nicht. ich hab das ganze dann immer damit gelöst, dass ich ne tabelle mit einer zelle drumgesetzt hab, dem ganzen den wert width: 100%; und height: 100%; gegeben hab und im (x)html bei der tabelle gesagt hab align="center".

kennt da jemand ne andere möglichkeit? mir ist beim besten willen keine eingefallen...

mfg

 

[feelx75]

AW: Website zentrieren

moinsen.

eure css-vorschläge sind ja alle gut und schön, aber was macht ihr, wenn ein element als position:absolute dargestellt werden soll mit einer fixen breite und immer zentriert?

selbst wenn ich da ein container-div drumsetze und dem den wert position:relative gebe, funzt die sache mit dem margin: 0 auto; nämlich nicht.

Hoi ...

1.) nehme an, es funzt im IE6 nicht? Das habe ich gerade nachvollzogen. Im FF funktioniert position: absolut trotzdem (natürlich nur, wenn es dann mit Abstand von oben oder unten positioniert wird)
2.) natürlich funktioniert position: relative nicht... Denn mit position: absolut positionierst du es ABSOLUT - d.h. ohne Rücksicht auf wrapper, body und der gleichen....

Hast du vielleicht mal ein Beispiel, was du genau vor hast?

Probiere gerade, dem IE6 die Flausen auszutreiben

edit
Bringe echt keine gescheite Lösung hin :-/
Wieder einer der Momente, wo ich am liebsten jedem Microsoft IE6 User persönlich einen stinkenden Fisch um die Ohren schlagen möchte
aber nochmal... sag mal, was du probiert hast Ich geh Ego-Shooter zocken... genau das Richtige jetzt! *fg*

 

[lucy_lawless]

AW: Website zentrieren

#id deiner div {
width:1196px; /*Angaben sind Beispiele*/
height:792px;
position:absolute;
left:50%;
margin-left:-598px; /*Hälfte der Breite*/
top:50%;
margin-top:-396px; /*Hälfte der Höhe*/
}

Div ist absolut zentriert - funktioniert auch im IE 6

 

[micha88]

AW: Website zentrieren

diese lösung schafft mehr probleme als sie löst...ist nämlich dein fenster nur 800px groß (ja es gibt immer noch leute mit 800 x 600 px als auflösung) dann ist die mitte (left:50%) bei 400px...margin-left:-598px nimmt er trotzdem von der mitte weg...d.h. es verschwinden 198 px von der linken seite, die dann "außerhalb des Browserfenster" stehen...

die beste lösung ist einfach margin:auto;...also bei mir funzt es auch überall (ff, opara, safarie, ie6-ie8b2) auch ohne die 0px

meine lösung:

CSS
* { margin:0px; padding:0px; }
div#all { width:100%; height:100%; position:absolute; }
div#content { margin:auto; widht:900px; height:500px; }

HTML

<html>
<body>
<div id="all">
<div id="content"></div>
</div>
</body>
</html>

geht bestimmt noch einfacher....aber wenn man hintergrundbilder benutzt ist es für mich besser zu händeln.

 

[lucy_lawless]

AW: Website zentrieren

diese lösung schafft mehr probleme als sie löst...ist nämlich dein fenster nur 800px groß (ja es gibt immer noch leute mit 800 x 600 px als auflösung) dann ist die mitte (left:50%) bei 400px...margin-left:-598px nimmt er trotzdem von der mitte weg...d.h. es verschwinden 198 px von der linken seite, die dann "außerhalb des Browserfenster" stehen...

Hallo??!!! da steht nicht IMMER margin-left:-598px; SONDERN margin-left:-598px; /*Hälfte der Breite*/ - also in deinem Fall -400px.
und damit sitzts genau zentriert

und margin:auto funktioniert eben NICHT bei abslolut positionierten elementen - in keinem browser. zudem zentriert margin:auton nur vertikal, nicht horizontal

und bevor jetzt wieder irgendjemand was falsch versteht: breite und höhe beziehen sich hier auf dein zu positionierendes element und NICHT auf des browserfenster (wie groß das beim nutzer ist, weißt du ja gar nicht)

 

[micha88]

AW: Website zentrieren

ja aber wenn das browserfenster nur 800px groß ist oder kleiner (je wie der nutzer das einstellt) dann ändert sich ja die css nicht automatisch...des left:50%; bezieht sich aber auf die Breite des aktuellen Browserfensters...mensch lesen...deshalb würde dann links was verschwinden...probier es doch einfach mal aus...deswegen beim horizontalen zentrieren einfach margin:auto;...beispiel siehe ganz unten

MeMO-TEC Fahrzeugtechnik - Startseite --> mach das Browserfenster ganz klein und du siehst was ich meine....

PS: ich beziehe mich auf die horizontale zentrierung...
und das zentrieren IN absolut positionierten divs funzt... http://www.steinwerk-schmidt.de

 

[cebito]

AW: Website zentrieren

33 Antworten auf so ein simples Problem (das nach dem 6ten Post auch schon gelöst)...

Leute, Leute, ihr verwirrt mich total Was ist denn jetzt der momentane Standard bzw. die sauberste Lösung? Will's ja schließlich gleich richtig lernen.

@micha @lucy & die potentiellen Nachposter - ich glaub ihr checkt das nicht. Wenn ihr noch andere Probleme habt, warum macht ihr nicht euren eigenen Thread auf. Dieses Problem war mit der Antwort von Herr_D schon gelöst!!!!

@siska - Lass dich nicht verwirren und ignorier einfach den ganzen Schrott - nimm die Lösung von Herr_D.

 

[lucy_lawless]

AW: Website zentrieren

sorry - das war auch gar keine antwort an siska - wenn dus vielleicht mal verfolgt hättest, sondern ne antwort auf die frage von mindrapper, der anschließend an den tipp mit margin-auto gefragt hatte, wie das dann mit absolut positionierten elementen ausssieht (ja, leider hat er dazu keinen eigenen thread aufgemacht)

ist aber recht sinnlos nen eigenen thread aufzumachen um auf ne frage zu antworten...

werds jetzt hier aber nicht mehr weiter diskutieren - wenn das jemand will - dann eigenen thread

 

[Monja]

AW: Website zentrieren

Wenn du einen guten Einstig in Dreamweaver willst dann leiste dir diese DVD.
Galileo Design : Video-Training : Adobe Dreamweaver CS3

Ich hab da, obwohl ich schon länger mit DW arbeite viele Tricks und Kniffe gelernt. DW von anfang an super erklärt. Ich hoffe ich darf das hier einstellen. Wenn nicht, bitte löschen.

 

[feelx75]

AW: Website zentrieren

33 Antworten auf so ein simples Problem (das nach dem 6ten Post auch schon gelöst)...



@micha @lucy & die potentiellen Nachposter - ich glaub ihr checkt das nicht. Wenn ihr noch andere Probleme habt, warum macht ihr nicht euren eigenen Thread auf. Dieses Problem war mit der Antwort von Herr_D schon gelöst!!!!

@siska - Lass dich nicht verwirren und ignorier einfach den ganzen Schrott - nimm die Lösung von Herr_D.

Das verstehe ich jetzt nicht ganz ... Zumindest, wenn ich diesen Thread via Suchfunktion finden würde, fände ich es gar nicht schlecht, ein paar Hinweise zur Zentrierung zu finden, anstatt mich erstmal in dutzende Threads einzulesen...

Jedenfalls thx @ Lucy für den Hinweis zur absoluten Positionierung Ich sah den Wald gerade nicht ... ^^

 

[cebito]

AW: Website zentrieren

Das verstehe ich jetzt nicht ganz ... Zumindest, wenn ich diesen Thread via Suchfunktion finden würde, fände ich es gar nicht schlecht, ein paar Hinweise zur Zentrierung zu finden, anstatt mich erstmal in dutzende Threads einzulesen...
...Ich sah den Wald gerade nicht ..

ICH aber schon, nur weil ihr zu faul oder was auch immer seid 'ne Frage zu stellen oder weiter zu recherchieren. Mal an die Threaderöffnerin gedacht? Die sitzt jetzt wahrscheinlich da und sieht den Wald vor lauter Bäumen nicht mehr!

 

[kaltestantchen]

AW: Website zentrieren

Hallo Siska,
ich kenn mich nicht mit Dreamweaver, da ich CSS so schreibe.
Ich hab meine Seite über
margin-left: auto;

margin-right: auto;
mittig platziert. Ob das nun gut oder schlecht ist , keine Ahnung.
Ob es überall funktioniert, ebenfalls keine Ahnung.
Bisher hat sich keiner beschwert.
LG sophie