1. Diese Seite verwendet Cookies. Wenn du dich weiterhin auf dieser Seite aufhältst, akzeptierst du unseren Einsatz von Cookies. Weitere Informationen

4 divs mit gleicher Höhe

Dieses Thema im Forum "Web-Programmierung" wurde erstellt von wapplegraph, 17.04.07.

  1. wapplegraph

    wapplegraph Normande

    Dabei seit:
    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
     
  2. m00gy

    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?
     
  3. wapplegraph

    wapplegraph Normande

    Dabei seit:
    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?
     
  4. m00gy

    m00gy Gast

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

    wapplegraph Normande

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

    wapplegraph
     
  6. Skeeve

    Skeeve Pomme d'or

    Dabei seit:
    26.10.05
    Beiträge:
    3.121
    Das geht, denke ich, nur mit
    a) Fest eingestellter Höhe (trivial)
    oder
    b) JavaScript
     
  7. wapplegraph

    wapplegraph Normande

    Dabei seit:
    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.
     
  8. Hilarious

    Hilarious Gelbe Schleswiger Reinette

    Dabei seit:
    10.08.05
    Beiträge:
    1.759
  9. wapplegraph

    wapplegraph Normande

    Dabei seit:
    12.04.06
    Beiträge:
    571
    Ja

    Aber ich habe schon Hintergrundbilder.

    wapplegraph
     
  10. Bief

    Bief Weigelts Zinszahler (Rotfranch)

    Dabei seit:
    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?
     
  11. wapplegraph

    wapplegraph Normande

    Dabei seit:
    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
     
  12. Bief

    Bief Weigelts Zinszahler (Rotfranch)

    Dabei seit:
    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...
     
  13. wapplegraph

    wapplegraph Normande

    Dabei seit:
    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
     
  14. HoverSK

    HoverSK Tydemans Early Worcester

    Dabei seit:
    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
     
  15. wapplegraph

    wapplegraph Normande

    Dabei seit:
    12.04.06
    Beiträge:
    571
    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
     
  16. HoverSK

    HoverSK Tydemans Early Worcester

    Dabei seit:
    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
     
  17. wapplegraph

    wapplegraph Normande

    Dabei seit:
    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?
     
  18. Bief

    Bief Weigelts Zinszahler (Rotfranch)

    Dabei seit:
    11.12.06
    Beiträge:
    249
    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>
    ...
     
  19. wapplegraph

    wapplegraph Normande

    Dabei seit:
    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
     
  20. ma.buso

    ma.buso Châtaigne du Léman

    Dabei seit:
    16.04.05
    Beiträge:
    824
    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.
     

Diese Seite empfehlen