nicht angemeldet
aufteilung der seite
Hallo, ich möchte gerne folgenden allgemeinen aufbau einer homepage machen, bin mir aber nicht sicher was das beste verfahren ist.
Die seite soll dreigeteilt sein. Oben und unten ein in der höhe feststehender streifen. Der Untere soll sich immer am unteren rand befinden. Der Mittlere soll wiederum in der höhe flexibel sein und sich dem monitor anpassen.
Die Breit möchte ich vermutlich auf einen festen Wert festsetzen (ca. 800px) um bei verschiedenen auflösungen ein gleichmäßiges bild zu gewährleisten und um sicherzustellen das es in der Mitte ist.
Zwei möglichkeiten fallen mir hier ein, beide mit Problemen.
1. Tabelle
Ich erstelle eine Tabelle (hight="100%") mit drei zeilen. Setze bei der oberen und unteren zeile feste höhen fest. Die mittlere müsste flexibel sein. Jedoch soweit ich weiß, gibt es bei Tabellen probleme feste und wariable höhen zu kombinieren
2. Div Elemente
Ich mache die drei zeilen mit <div> Elementen. Jedoch wie setze ich das untere Element an den unteren Rand (position:absolute ist blöd) und wie bringe ich das mittlere div dazu immer so hoch zu sein wie der zwischenraum zwischen den beiden anderen.
Hoffe jemand hat ne idee.
(Übrigens was kann man eigentlich bei css verwenden um das veraltete <center> tag zu ersetzen? Finde da nichts)
-
Hallo,
Die seite soll dreigeteilt sein. Oben und unten ein in der höhe feststehender streifen. Der Untere soll sich immer am unteren rand befinden.
Also so ähnlich wie http://www.erweiterungen.de/?
Der Mittlere soll wiederum in der höhe flexibel sein und sich dem monitor anpassen.
Wozu? Wenn der zu groß wird, würde der Text nach unten darüber hinaus gehen.
Die Breit möchte ich vermutlich auf einen festen Wert festsetzen (ca. 800px) um bei verschiedenen auflösungen ein gleichmäßiges bild zu gewährleisten und um sicherzustellen das es in der Mitte ist.
Schlechte Idee. Erstelle lieber ein flexibles Design, wo der Anwender nicht jedes Mal quer scrollen muss; ggf. mit einer Maximalbreite.
Zwei möglichkeiten fallen mir hier ein, beide mit Problemen.
- Tabelle
Ich erstelle eine Tabelle (hight="100%") mit drei zeilen. Setze bei der oberen und unteren zeile feste höhen fest. Die mittlere müsste flexibel sein. Jedoch soweit ich weiß, gibt es bei Tabellen probleme feste und wariable höhen zu kombinieren
Das eigentlich nicht, aber Tabellen sind einfach nicht für Layoutzwecke gedacht.
- Div Elemente
Ich mache die drei zeilen mit <div> Elementen. Jedoch wie setze ich das untere Element an den unteren Rand (position:absolute ist blöd)
Das Zauberwort lautet position:fixed! Fixiere das obere und untere Element einfach absolute und passe die Abstände des <body>s so an, dass es ganz oben/ ganz unten keine Überlappungen gibt und die Inhalte zugänglich sind.
und wie bringe ich das mittlere div dazu immer so hoch zu sein wie der zwischenraum zwischen den beiden anderen.
Am Besten gar nicht. Lass es so hoch wie der Text sein, ober mach es 100% hoch.
Übrigens was kann man eigentlich bei css verwenden um das veraltete <center> tag zu ersetzen?
Ja. Block-Elemente mit einer Breite < 100% zentrierst du mit
margin:auto;den Text darin mittext-align: center.mfg. Daniel
-
vielen dank schonmal. Bin gerade in der neufindung des designs :)
Es geht um folgende seite www.perlenspiele.de
Das Design gefällt mir sowieso nicht so wirklich, Wenn hier noch gute ideen kommen nehme ich die gerne auf ;-)
Zudem will ich diesmal auch ganz lieb sein und alle designelemente in eine css datei auslagern :)Habe jetzt noch zwei Probleme. Do obere Teil über dem rotem Strich funktioniert soweit schon ganz gut. Nur wenn der Bildschirm ziemlich schmal ist, ruchtschen die drei Worte Rechts über die Überschrift was mir nicht gefällt. Die alternative die mir einfällt währen fixe positionen, was ich aber auch nicht möchte. Dies aber aber eher umbedeutend.
Das größere ist das bild unten drunter. Ganz abgesehen davon das ich die Perlen an einem "unsichtbaren" Kreis um den Kopf anordnern möchte ist hier die Frage wie ich es dann schaffe das alles in der selben Position bleibt und immer schön in der mitte ist. Was mir hier einfällt ist alles in ein div reinpacken und das margin:auto Bessere Idee????
-
Hallo,
Habe jetzt noch zwei Probleme. Do obere Teil über dem rotem Strich funktioniert soweit schon ganz gut. Nur wenn der Bildschirm ziemlich schmal ist, ruchtschen die drei Worte Rechts über die Überschrift was mir nicht gefällt.
Wie hast du die Wörter positioniert? Ich würde sie in einen Block einschließen und rechts floaten oder mit
position:absolute;right:0;top:0;rechts positionierenDie alternative die mir einfällt währen fixe positionen, was ich aber auch nicht möchte.
Wenn die fixen Positionen vom rechten Seitenrand ausgehen und Überlappungen durch entsprechende Abstände (bei den darunter-liegenden Elementen) verhindert werden, dürfte es auch keine Probleme geben.
Das größere ist das bild unten drunter. Ganz abgesehen davon das ich die Perlen an einem "unsichtbaren" Kreis um den Kopf anordnern möchte ist hier die Frage wie ich es dann schaffe das alles in der selben Position bleibt und immer schön in der mitte ist. Was mir hier einfällt ist alles in ein div reinpacken und das margin:auto.
Würde ich wohl auch so machen.
Bessere Idee????
Nein
mfg. Daniel
-
- Tabelle