4 divs mit gleicher Höhe

wapplegraph

Normande
Registriert
12.04.06
Beiträge
571
Hallo

Ich habe fünf divs, und möchte, dass alle die gleiche Höhe haben. Die Höhe variert!

Also ich möchte, dass alle die Höhe vom div inhalt1 haben.

Wie kann man dies lösen?

Code:
<div id="middle">
		<div id="border1"></div>
		<div id="inhalt1">
			<div id="iinhalt1"></div>
		</div>
		<div id="border2"></div>
		<div id="inhalt2"></div>
		<div id="border3"></div>
	</div>

http://www.projekt07.sunel.ch
Besten Dank wapplegraph
 

m00gy

Gast
Nur mal so zum Verständnis:

Threadtitel: "4 divs mit gleicher Höhe"
Erster Satz: "Ich habe fünf divs, und möchte, dass alle die gleiche Höhe haben."

Erster Satz: "Ich habe fünf divs, und möchte, dass alle die gleiche Höhe haben."
Zweiter Satz: "Die Höhe variiert!"

Hä?

Ansonsten: Meinst Du vielleicht die Ebenen, auf der die DIVs liegen? Mit "z-index" oder wie?
 

wapplegraph

Normande
Registriert
12.04.06
Beiträge
571
Ja, ich habe gemerkt, dass es fünf divs sind und ich konnte den Titel nicht mehr ändern.

Ist dies relevant?
 

m00gy

Gast
Ich versteh einfach nicht so genau, was Du eigentlich willst...
 

wapplegraph

Normande
Registriert
12.04.06
Beiträge
571
Ich möchte, dass sich meine divs der Höhe vom div inhalt1 anpassen.

wapplegraph
 

Skeeve

Pomme d'or
Registriert
26.10.05
Beiträge
3.120
Das geht, denke ich, nur mit
a) Fest eingestellter Höhe (trivial)
oder
b) JavaScript
 

wapplegraph

Normande
Registriert
12.04.06
Beiträge
571
Ok.

Also mit fester Höhe geht nicht.

Wie funktioniert dies dann mir Javascript?

Also ich kann eigentlich kein Javascript. Kann PHP und habe mir schon ein Tutorial über Javascript angeschaut. Habe Javascript jedoch noch nie richtig benutzt.
 

Bief

Weigelts Zinszahler (Rotfranch)
Registriert
11.12.06
Beiträge
249
Vielleicht funktioniert ja...
a) height:inherit
b)height:100% (so wie bei Tabellen die Breite)

Falls nicht:
Code:
<head>
<script>
function setDIV() {
document.getElementById('inhalt2').height = document.getElementById('inhalt1').height;
//Und so mit allen divs und ihren IDs
}
</script>
</head> 
<body onLoad="setDIV()">
...
</body>
Müsste gehen, oder?
 

wapplegraph

Normande
Registriert
12.04.06
Beiträge
571
Hallo

Danke für den Code.

Er klappt jedoch nicht und muss inhalt1 (also dieses Element, wo ich die Höhe nehme) rechts oder links beim Gleich stehen? Habe beides ausprobiert.

wapplegraph
 

Bief

Weigelts Zinszahler (Rotfranch)
Registriert
11.12.06
Beiträge
249
Das was du verändern willst, steht immer links. Also stimmt das in dem Fall...

Schau es dir mal mit Firefox an und öffne die Fehlerkonsole (Extras -> Fehlerkonsole)
Aber ich glaube du musst style.height anstatt nur height schreiben...

Falls es dann immer noch nicht geht, dann probiers mal manuell aus, ob es dann funktioniert...
 

wapplegraph

Normande
Registriert
12.04.06
Beiträge
571
Es klappt noch nicht.

Code:
<script>
		function setDIV() 
		{
		document.getElementById('border1').style.height = document.getElementById('inhalt1').style.height;
		document.getElementById('border2').style.height = document.getElementById('inhalt1').style.height;
		document.getElementById('inhalt2').style.height = document.getElementById('inhalt1').style.height;
		document.getElementById('border3').style.height = document.getElementById('inhalt1').style.height;
		}
</script>

</head>

<body>

<script>
	OnLoad="setDIV()"
</script>

Wie meinst du es manuel? Das checke ich nicht.

Besten Dank Jonas
 

HoverSK

Tydemans Early Worcester
Registriert
30.03.07
Beiträge
395
vlt hab ich nicht verstanden was du willst aber warum packst du nicht um deine divs welche die gleiche höhe haben sollen noch ein div drumherum das hat dann die höhe des höchsten Elementes

Sorry falls ich an deiner Anforderung vorbeirede.

MfG
HoverSK
 

wapplegraph

Normande
Registriert
12.04.06
Beiträge
571
vlt hab ich nicht verstanden was du willst aber warum packst du nicht um deine divs welche die gleiche höhe haben sollen noch ein div drumherum das hat dann die höhe des höchsten Elementes

Sorry falls ich an deiner Anforderung vorbeirede.

MfG
HoverSK

Ja ich glaube dies wäre eine Lösung, ich habe jedoch keine Erfahrung mit Kinder- und Elternelementen.

Also alle müssten dann die Höhe vom div#middle haben.

Code:
<div id="middle">
		<div id="border1"></div>
		<div id="inhalt1">
			<div id="iinhalt1">
			
			</div>
		</div>
		<div id="border2"></div>
		<div id="inhalt2">
					</div>

wapplegraph
 

HoverSK

Tydemans Early Worcester
Registriert
30.03.07
Beiträge
395
nein sie haben immer noch ihre eigene Höhe nur <div id="middle"> hat dann die höhe des höhsten Elementes welches sich in ihm befindet also die Lösung falls es dir um nen Rahmen oder Sowas geht bzw du etwas drunter machen möchtest.

bei solchen Fragen empfehle ich dir http://de.selfhtml.org/
für alles HTML betreffende
und
http://www.css4you.de/
für alles was mit CSS also Design und Anordnung zu tun hat dort findest du viele Beispiele mir haben diese Seiten bis her immer gereicht um eine Lösung zu finden.

MfG
HoverSK
 

wapplegraph

Normande
Registriert
12.04.06
Beiträge
571
Aha

Nee also das bringt mir leider nichts. DAnn muss ich es wohl mit JavaScript lösen.

Nun eine Frage:

Stimmt der Befehl document.getElemetById('').style.height? weil wenn ich dies in eine Variable schreiben lasse und diese ausgeben möchte so kommt ein Fehler und es steht: undefined.

Könnte mir jemand bei der JavaScript Lösung helfen?
 

Bief

Weigelts Zinszahler (Rotfranch)
Registriert
11.12.06
Beiträge
249
Aha

Nee also das bringt mir leider nichts. DAnn muss ich es wohl mit JavaScript lösen.

Nun eine Frage:

Stimmt der Befehl document.getElemetById('').style.height? weil wenn ich dies in eine Variable schreiben lasse und diese ausgeben möchte so kommt ein Fehler und es steht: undefined.

Könnte mir jemand bei der JavaScript Lösung helfen?

Du kannst grundsätzlich nur Strings (Zeichenketten) und (bei JavaScript) Zahlen anzeigen lassen. Hier bei handelt es sich jedoch um ein Objekt!

Außerdem, musst du in deiner HTML-Datei folgendes schreiben:
Code:
<body onload="setDIV();">

Mir manuell habe ich gemeint:
Code:
<div style="height:200px" id="inhalt1"></div>
...
 

wapplegraph

Normande
Registriert
12.04.06
Beiträge
571
Also irgendwie klappt es noch nicht.

Das manuell geht nicht, also ist in meinem Fall nicht zu gebrauchen

wapplegraph
 

ma.buso

Châtaigne du Léman
Registriert
16.04.05
Beiträge
820
Du kannst nicht erzwingen, dass benachbarte divs die gleiche Höhe haben.

Schreib lieber auf, was du für ein Ergebnis erzielst, dann kann man dir auch helfen.