Positionierung zentriert, CSS
Micha
- browser
0 Alex0 Micha0 Alex0 Jeena Paradies0 Micha0 Detlef G.0 Micha0 Ingo Turski0 Detlef G.
Hallo,
ich sitze hier an einer Sache, die ich weder mit Hilfe meiner Bücher, noch mit google oder selfhtml lösen konnte. Wahrscheinlich liegt es an meinen Suchbegriffe.
Vielleicht habt ihr eine Idee!? Auf meiner Seite http://www.london86.de möchte ich, dass der Inhalt in der jetztigen Anordnung nicht rechtbünding im Browser angezeigt werden, sonder in jedem Brwoser in der Mitte. Zusätzlich soll dann der Hintergrund z.B. grau sein.
Hinweis: Ich verwende CSS und somit sind die Elemente auf der Seite alle in unterschiedlichen Ebenen.
Vielen Dank für Eure Hilfe.
Micha
Geht das nicht über
body {
align: center;
background-color: #FF00FF;
}
? also falls es das ist was du suchst ?
Hintergrundfarbe natürlich noch richtig einstellen :)
Hallo Alex,
vielen Dank für Deine schnelle Antwort. Das mit der Hintergrundfarbe hat geklappt. Da hast Du Dir ja spontan die schönste Farbe rausgesucht ;-) Beim Rest schaue ich immernoch ins Leere.
Nehmen wir an ich habe einen grauen Hintergrund. Auf dieses Hintrergrund soll eine weiße Fläche, die zentriert in jedem Browser angezeigt wird. Und eben auf dieser Fläche sollen die Elemente (die einzelnen Ebenen, die jetzt schon auf meiner Homepage sind, d.h. sie würden dann auch zentriert im Browser angezeigt werden.
Ich stelle mir das so vor, dass ich die Position der einzelnen Ebene auf der weißen Fläche festlegen muss. Dann muss ich nur noch die weiße Fläche zentrieren.
Ich habe es mal mit einer Tabelle versucht, die eine Zeile und eine Spalte hat. In dieser Zeile und Spalte waren dann alle Elemente. Trotzdem habe ich die Tabelle nicht zentrieren können.
Any idea?
Hi Micha,
also ich hab jetzt nochmal in deinen Code geschaut und dort gesehen, dass du deine "Module" fest dort einpflegst.
http://css4you.de/
Auf dieser Website gibts viele Infos zu eben solchen Anforderungen die du hast.
Im Prinzip kannst du auch eine Pseudotabelle erstellen über CSS.
Steht aber auch alles auf dieser Seite.
Diese Pseudotabelle machst du dann im prinzip über die CSS file in der du Angibst, wie groß eine PseudoZelle sein soll.
ich hoffe das hat dir weitergeholfen.
mfG - Alex
Hallo,
Any idea?
Also ich Zentriere meine Inhalte eigentlich meist so:
CSS
body {
background: #aaa;
text-align: center; // braucht IE im Quirksmode (also auf jeden fall < IE6)
}
#container {
text-align: left; // das ganze wieder zurücksetzen
margin: auto; // eigentlich braucht man es nur für rechts und links auf auto
width: 60em;
background: #000;
}
<html>
<head>
<title>Meine Seite</title>
<link rel="stylesheet" type="text/css" href="css/screen.css" media="screen" >
</head>
<body>
<div id="container">
<!-- hier ganz normal alle deine Inhalte -->
</div>
</body>
</html>
Grüße
Jeena Paradies
Hi Jeena,
also in den Container packen ich sozusagen alle Ebenen (also meinen jetztigen Inhalt). Ich habe Deine Variante versucht, allerdings nehmen die Ebenen nicht ihren Platz im Container ein. Ich nehme an, dass hat irgendetwas mit den usprünglich zugewiesenen Positionen zu tun, oder? Der Container ist weiterhin auch nicht in der Mitte des Browser sondern weiterhin linksbündig.
Wo kann da mein Fehler liegen.
Cheers, Micha
Hallo Micha
Wo kann da mein Fehler liegen.
Vielleicht in absoluten Positionierungen, die sehr häufig absolut falsch und
absolut unnötig sind.
Auf Wiederlesen
Detlef
Hallo Detlef,
das bedeutet dann also, dass ich die Position der Ebenen relativ zum Container angeben muss?!
Das probiere ich gleich mal aus.
Thx, Micha
Hi,
das bedeutet dann also, dass ich die Position der Ebenen relativ zum Container angeben muss?!
nein. Du solltest die Eigenschaft position nur dann verwenden, wenn dies unbedingt erforderlich ist. In Deinem Fall reicht float und margin.
freundliche Grüße
Ingo
Hallo Micha
das bedeutet dann also, dass ich die Position der Ebenen relativ zum Container angeben muss?!
Nein, position selbst ist eine Eigenschaft, die nur eingestzt werden sollte,
wenn man genau weiß, was man tut. Sie sollte ganz speziellen Effekten
vorbehalten bleiben, die anders nicht zu erreichen sind.
Für die Anordnung und Ausrichting von Elementen und ihren Außen- und
Innenabständen und dienen margin, padding, float und clear, in Verbindung mit
text-align, width und height.
Meiner Meinung nach stellt CSS-basierte Layouts dazu einen sehr guten
Einstieg dar.
Noch ein paar Bemerkungen zu http://www.london86.de/:
Warum sind dort lauter Tabellen in zusätzliche Divs gepackt?
Die Seite hat keine Überschriften, keine Absätze, keine Listen.
Sie ist Layout ohne sinnvolles HTML.
Wenn du Tabellen fürs Layout verwenden willst, dann kannst du dies auch
vollständig tun.
Wenn du die Eigenschaften und Anordnung der Tabellen mit Hilfe von CSS
bestimmen willst, brauchst du kein Div um jede Tabelle. Außerdem sind
einspaltige Tabellen nun wirklich unnötig.
Wenn du aber ein CSS-Layout umsetzen willst, dann sollten Tabellen auch nur
für tabellarische Daten verwendet werden.
Das Layout dieser Seite dürfte sich ohne größere Probleme nur mit sinnvollem
HTML und CSS umsetzen lassen.
Ich würde dir empfehlen, nocheinmal von vorn anzufangen.
Vergesse erstmal, _wie_ die Seite aussehen soll, denke nur daran, _was_ auf
die Seite soll.
http://forum.de.selfhtml.org/archiv/2005/1/t98401/#m599864
http://forum.de.selfhtml.org/archiv/2004/12/t95859/#m582401
Auf Wiederlesen
Detlef