|
|||
Horizontal Platz ausnutzen
Hallo,
ich habe eine Seite, auf der html und body height:100% haben und im body ist dann ein div-Container mit height:95%. Darin befindet sich oben ein Container mit absoluter Höhe und unten möchte ich einen, der (von 10px margin abgesehen) den noch freien Platz ausnutzt, finde aber leider keine Lösung dafür. Relative Höhe geht nicht, wegen dem darüber, absolute geht nicht, weil das Elternelement relative Höhe hat, auto mit festgelegtem margin passt die Höhe leider dem Inhalt an, obwohl in der Breite mit margin:10px und width:auto das Element größtmöglich wird. Edit: Der Titel sollte natürlich vertikal heißen Geändert von Shakademus (10.05.2009 um 12:25 Uhr) |
Sponsored Links |
|
|||
Hallo Shakademus,
wie wäre es mit lauffähigem Code oder einem Link? Ansonsten geht wohl 100% Höhe in deine Richtung.
__________________
Grüsse Andreas- auch mal wieder da... Design isn't about the tools, it's about creating the best experience for the user. A design should be based on usability, accesibility, aesthetics, but never on floats, lists or background images. ( by Cameron Adams) Wiedergelesen: > hier und hier [Foren-Links] Dein Post? Klar, DAS vorher gelesen? Hilft. ## User-Landkarte Geändert von andir (11.05.2009 um 00:50 Uhr) |
Sponsored Links |
|
|||
OK, das Problem ist hier dargestellt: Test
100% Höhe löst mein Problem wohl nicht. Die dort referenzierte Lösung mit floatierenden DIVs ist nämlich eine Mogelpackung. Das sieht zwar auf den ersten Blick gut aus, in Wirklichkeit sind links, rechts und unten aber nur so hoch wie ihr Inhalt. Das bringt mich leider nicht weiter, da mein Inhalt eine Kartenanwendung sein soll, die sich an die Größe des Containers anpasst. Die muss dementsprechend vorbestimmt sein. Grundsätzlich wäre auch JavaScript denkbar, da das für die Anwendung ohnehin nötig ist. Das erstmalige setzen der Höhe ist auch kein Problem, nur muss die dann beim Ändern des Fensters angepasst werden und bevor ich eine solche Overkill-Lösung schreibe, wollte ich mal nach Rat fragen, ob's nicht doch auch irgendwie mit CSS klappt. |
|
|||
Dann wäre es doch am besten, du schachtelst den header oder was das ist in den "ich soll bis nach unten" gehen Container, dem du dann die 100% Höhe gibst. Dortige Inhalte könnten per padding /margin entsprechend von oben gesehen positioniert werden.
__________________
Grüsse Andreas- auch mal wieder da... Design isn't about the tools, it's about creating the best experience for the user. A design should be based on usability, accesibility, aesthetics, but never on floats, lists or background images. ( by Cameron Adams) Wiedergelesen: > hier und hier [Foren-Links] Dein Post? Klar, DAS vorher gelesen? Hilft. ## User-Landkarte |
|
|||
Hm. Das verlagert das Problem nur eine Ebene nach unten. Dann ist der Kopf mit im unteren Container und darunter muss dann ein div hin, bei dem ich wieder das Problem hab, die richtige Höhe einzustellen.
Verzwickt... |
|
|||
Zitat:
Ansonsten kannst Du mehrfach schachteln und es nur so aussehen lassen, als wären die letzten 5% ein eigener Container oder: Der 5% Container wird mit pos. absolute und 5% Höhe bottom:0 in einen 100% Container gesetzt, der ebenfalls den 95% Container enthält. Das mag im Einzelfall Einschränkungen bei der grafischen Gestaltung geben ( etwas Pixelspiel mitgeben), muss aber nicht. Border oder margins/paddings sind bei diesem Konstrukt und bei diesen Containern dann nicht möglich, aber das ist dir ja klar, oder?
__________________
Grüsse Andreas- auch mal wieder da... Design isn't about the tools, it's about creating the best experience for the user. A design should be based on usability, accesibility, aesthetics, but never on floats, lists or background images. ( by Cameron Adams) Wiedergelesen: > hier und hier [Foren-Links] Dein Post? Klar, DAS vorher gelesen? Hilft. ## User-Landkarte |
|
|||
Meinst Du mit 5% den oberen? Das ist ja gerade das Problem, dass der keine relative Größe hat, an der ich mich orientieren kann. Der obere Kasten enthält Steuerelemente in Form von Formularen mit Labels. Wenn ich dem relative Höhe geben würde, wäre das Problem natürlich aus der Welt, dann müsste ich aber dem Inhalt - sprich: Inputs und Text - auch relative Höhe geben, damit die größe passt und relative Schrift fände ich doch recht merkwürdig...
Also nochmal ganz konkret: Der Rahmen hat eine bestimmte Höhe, relativ zum Browserfenster, damit der Platz optimal genutzt wird. Der obere Kasten hat eine absolute Höhe und der untere Kasten soll jetzt allen Platz nutzen der ihm in seinem Bereich zur Verfügung steht. Nur leider lässt sich der nicht in einem Wert ausdrücken. |
|
|||
Fütter mal die Suchfunktion mit "Pseudo-Frame-Layout". Vermutlich ist es das, was du suchst.
__________________
Corina Rudel Online-Einsteigerkurs HTML/CSS | Buch: Fortgeschrittene CSS-Techniken |
|
|||
Was soll ich noch sagen? Was hat denn deine Recherche ergeben?
Du möchtest ein Layout mit einem Bereich mit fester Höhe plus einen Bereich mit Resthöhe. Das nenne ich Pseudo-Frame-Layout. Das wird oft gefragt -- deshalb liefert die Suchfunktion auch Lösungen.
__________________
Corina Rudel Online-Einsteigerkurs HTML/CSS | Buch: Fortgeschrittene CSS-Techniken |
Sponsored Links |
Themen-Optionen | |
Ansicht | |
|
|
Ähnliche Themen | ||||
Thema | Autor | Forum | Antworten | Letzter Beitrag |
div immer verfügbaren vertikalen Platz füllen lassen | MrWhite | CSS | 4 | 07.08.2009 19:32 |
Content-Höhe = verfügbarer Platz | Plasm | CSS | 7 | 19.09.2008 22:43 |
Hintergrundbild vertikal UND horizontal zentrieren? | yggdrasil | CSS | 3 | 06.07.2008 11:19 |
Bilder sollen horizontal die ganze Fläche ausnutzen | naitsab | CSS | 13 | 21.01.2008 21:07 |
Tabelle in CSS: mittlere Spalten sollen Platz ganz ausfüllen | wiseguy | CSS | 2 | 23.03.2007 19:31 |