Ach ja ich vergaß zu erwähnen, dass die Breite und die Anordnung der Divisions nicht flexibel sondern statisch sein soll.
Beiträge von renegadeX
-
-
Hallo,
ich habe in eine <div> mit der id "content". Diese sitzt im <body> mit Höhe 100%. Dort ist ein header mit fester Höhe. Die division soll nun den restlichen Bereich der 100% ausfüllen.
Das Problem ist ja, dass height nicht vererbt wird oder einen Wert hat wie "fill rest" oder so. Wenn ich also der Division nun auch 100% gebe, geht sie über den Body.Gibt es eine Möglichkeit das zu lösen? Sowas wie height: (100% - 150px); oder so etwas?
mfG
-
http://www.winaringer.de/odins-hoerner/test.html
und
http://www.winaringer.de/odins-hoerner/test.css
sind die aktuellen Versuche. Ich habe nun die Tags angepasst und das design definiert, allerdings will ich nicht einzelne Boxen, die sich verschieben, wie sie lustig sind, sondern die Struktur soll fest bleiben.
So soll quasi die Seite aussehen, nur das alte Problem ist noch da. das menü links soll die maximale height ausnutzen und diese ist leider dynamisch durch den article definiert.Also noch irgendwelche Tipps?
P.s.: Ach ja die Abstände über dem Bild und dem footer sollten auch nicht sein.
-
Doch, der hat beim kopieren und splitten irgendwie was verschoben.
Aber ich denke leider ist dein Vorschlag nichts für mich. Ich kann die breiten nicht verändern, ohne dass er die Container verschoben werden von der Zeile her.
ändere ich die Breite vom Body, flippt alles in eine reihe, anstatt das alles schmaler wird usw. -
Ah super thx.
Warum macht das der dämliche NP++ ständig.
jetzt funzt es.So nun heisst es zerlegen und forschen.
-
OK, das war nur eine Einstellungssache meines Notepad++. Ist erledigt, aber passt immer noch nicht.
http://www.winaringer.de/odins-hoerner/test02.html
Das ist die Seite mit integriertem Style. Also das original von dir.
Warum nimmt er die externe nur halb an?
-
wieso nimmt er mir das als externe .css nicht an?
http://www.winaringer.de/odins-hoerner/test03.html -
Ah da is der böse Fehler. irgendwie hat der mir ein paar Tags direkt geschlossen. Kam wohl mit der Formatierung ned klar.
-
Ich nutze Firefox 38.0 und habe es auch mit IE 11.
Bei beiden das selbe.
Ich habe deinen Code in ein blankfile kopiert und es auf den Server geschoben.Das mit dem Bild ist erstmal nebensächlich. Wichtiger sind mir die divisions sollen machen, was ich will.
-
OK, du hast eine div unter der anderen, das bekomme ich auch noch hin, aber wie mache ich es, dass 2 nebeneinander sind und die gleiche höhe haben?
Die Breite wird bei mir durch das Logobild vorgegeben. Es sei denn ich finde und baue eine dynamische resize Funktion ein.[TABLE='class: outer_border, width: 500']
[tr][td]header
[/td][td][/td][/tr][tr][td]Navmenü
[/td][td]Topmenü
[/td][/tr][tr][td][/td][td]Inhalt
Dieser hat eine dynamische Länge
[/td][/tr][tr][td]Footer
[/td][td][/td][/tr]
[/TABLE]So soll es im Prinzip aussehen und das Navmenü soll genauso hoch sein, wie der dynamische Text rechts davon und das Topmenü zusammen
-
Hallo,
ich will mir ein template für meine HP bauen, aber das mit den divs haut nicht so hin, wie ich es will. WEr hat einen heissen Tip für mich?
Ich habe zur besseren Sichtbarkeit mal alle divisions farbig umrandet.
Eigentlich sollte der header und footer eine statische Höhe haben, was auch klappt.
Im Bereich main sollte links über die ganze Höhe das menuleft gehen mit statischer Breite. der rechte teil soll oben vom topmenu(statische Höhe) und darunter vom content(dynamische Höhe) gefüllt sein.
Das menuleft soll die gleiche Höhe haben, wie topmenu und content zusammen.HTML
Alles anzeigen<html> <head> <meta http-equiv="content-type" content="text/html; charset=ISO-8859-1"> <title>test OH</title> <link rel="stylesheet" href="teststyle.css" type="text/css"> </head> <body> <div id="header">header </div> <div id="main"> <div id="menuleft"><span editable="true" id="menuleft">menu</span> </div> <div id="topmenu"><span editable="true" id="topmenu">topmenu</span> </div> <div id="content"> <span editable="true" id="content">Inhalt</span> </div> </div> <div id="footer"> <span editable="true" id="footer">unten</span> </div> </body> </html>Die Stylesheets
HTML
Alles anzeigenhtml { margin: 0; padding: 0; height: 100%; } body { width: 800px; height: 100%; margin-right: auto; margin-left: auto; text-align: center ; border-style: solid; border-color: red; } #header { height: 150px; border-style: solid; border-color: green; } #main { height: 100%; border-style: solid; border-color: blue; } #topmenu { height: 25px; margin-left: 150px; border-style: solid; border-color: yellow; } #menuleft { min-height:500px; float: left; width: 150px; border-style: solid; border-color: orange; } #content { min-height:500px; overflow: auto; margin-left: 150px; background-color: rgb(255, 255, 204); border-style: solid; border-color: violet; } #footer { height: 25px; clear: both; border-style: solid; border-color: grey; }Was mach ich falsch?