2 elemente sollen die gleiche höhe haben wie???

Dieses Thema im Forum "Webentwicklung" wurde erstellt von AsAck, 16. August 2008 .

Schlagworte:
Status des Themas:
Es sind keine weiteren Antworten möglich.
  1. 16. August 2008
    ich hab 2 elemente und weiß nicht wie ich mit css beide gleich hoch machn kann so dass die größe an das größere element anpasst je nachdem wie viel inhalt ich habe

    mfg AsAck
     
  3. 1. September 2008
    AW: 2 elemente sollen die gleiche höhe haben wie???

    sorry aber mit der anfrage kann man absolut nix anfangen... wie designst du? tabellen oder divs? was soll überhaupt gleich hoch? wie ist die struktur außenrum? so kann dir da lieder niemand helfen...

    ansonsten geht feste höhe im css mit: " height: XXpx; " oder auch % angaben.


    greeze wurm
     
  4. 2. September 2008
    AW: 2 elemente sollen die gleiche höhe haben wie???

    Also ich kann mit seiner Frage was anfangen

    Egal ob div oder td, bei beiden gehts gleich.
    Aber anstellen kannst du das wohl nur mit Javaskript, zb bei onload.
    Das Skript prüft dann einfach die beiden Höhen die gewünscht sind, nimmt die größere Höhe und legt beide Bereiche mit dieser Höhe fest.

    Folgende Links könnten nützlich sein:
    SELFHTML: JavaScript / Objektreferenz / document
    SELFHTML: JavaScript / Objektreferenz / style

    Btw das ist Webtechnik

    MfG
     
  5. 2. September 2008
    AW: 2 elemente sollen die gleiche höhe haben wie???

    such mal nach "min-height" in selfhtml
    sollte sein was du brauchst
     
  6. 4. September 2008
    AW: 2 elemente sollen die gleiche höhe haben wie???

    also danke
    ich machs wahrscheinlich mit fester höhe und lass bei mehr inhalt eine scrollleiste anzeigen

    konnt leider nich früher antworten weil ich im urlaub war

    mfg AsAck
     
  7. 4. September 2008
    AW: 2 elemente sollen die gleiche höhe haben wie???

    Code:
    function eqHeight(e1, e2) {
 //get height of e1
 if(!e1.parentNode && typeof e1 == 'string') {
 e1 = document.getElementById(e1);
 var e1_height = e1.offsetHeight; 
 } else if(typeof e1.offsetHeight != 'undefined') { 
 //can be 0 too 
 var e1_height = e1.offsetHeight;
 } else throw "unexpected argument(0) in eqHeight, element or element-id expected";
 
 //same on e2 
 if(!e2.parentNode && typeof e2 == 'string') {
 e2 = document.getElementById(e2);
 var e2_height = e2.offsetHeight; 
 } else if(typeof e2.offsetHeight != 'undefined') { 
 //can be 0 too 
 var e2_height = e2.offsetHeight;
 } else throw "unexpected argument(1) in eqHeight, element or element-id expected";
 
 if(e1_height >= e2_height) {
 e2.style.height = e1_height + 'px';
 } else {
 e1.style.height = e2_height + 'px';
 }
}
    sollte klappen
     
  8. 5. September 2008
    AW: 2 elemente sollen die gleiche höhe haben wie???

    Murdoc die Leute sollen das doch lernen, nicht immer gleich die Lösungen geben :]
    Also ich gebe das weiter was ich auch gemacht habe: Learning by doing.
    Ein paar Ansätze, Hinweise etc reichen doch völlig aus :]
    Aber ist schon nett von dir dass du allen Lösungen gibts / was erstellst

    MfG
     
  9. 5. September 2008
    AW: 2 elemente sollen die gleiche höhe haben wie???

    @murdoc wo soll ich diesen code einfügen und muss ich noch was ändern?
    weil mit javascript hab ich mich noch nich beschäftigt

    schon mal danke im voraus

    mfg AsAck
     
  10. 5. September 2008
    AW: 2 elemente sollen die gleiche höhe haben wie???

    Dann fang doch jetzt damit an.
    Ich mein wie mein Javaskript einbindet lernt man ja wohl ganz schnell auf selfhtml...
    Javaskript Einführung @ Selfhtml.org

    e1 und e2 sind die Ids von den Elementen. Das setzt natürlich vorraus, dass du deinen Elementen eine ID gibst.

    MfG
     
  11. 5. September 2008
    AW: 2 elemente sollen die gleiche höhe haben wie???

    so, hier was für den lerneffekt =)

    source:
    HTML:
    <?xml version="1.0" encoding="utf-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="de">
 <head>
 <title>eqHeight</title>
 <meta http-equiv="content-type" content="application/xhtml+xml;charset=utf-8" />
 <script type="text/javascript">
 //<![CDATA[ 
 //was is denn CDATA fuer ein tag? und was soll der hier?
 //http://de.selfhtml.org/html/xhtml/unterschiede.htm#script_style
 function isElement(obj) {
 if(typeof Element == 'object')
 return (obj instanceof Element);
 return obj && obj.nodeType == 1;
 }
 
 function eqHeight(e1, e2) {
 if(!isElement(e1)) e1 = document.getElementById(e1);
 if(!e1) throw 'unexpected argument(0) in eqHeight: node not found"';
 if(!isElement(e2)) e2 = document.getElementById(e2);
 if(!e2) throw 'unexpected argument(1) in eqHeight: node not found';
 e1.style.height = e2.style.height = Math.max(e1.offsetHeight - 2, e2.offsetHeight - 2) + 'px';
 }
 //]]>
 </script>
 <style type="text/css">
 /* <![CDATA[ */
 #element1 { line-height: 200px; }
 #element1, #element2 { 
 float: left; 
 margin: 10px 5px;
 border: 1px solid #000;
 text-align: center;
 width: 350px;
 }
 /* ]]> */
 </style>
 </head>
 <body>
 <div id="element1">
 ich bin dank CSS 200 pixel hoch.
 </div>
 <div id="element2">
 ich bin so hoch wie ben&ouml;tigt.
 </div>
 <div style="clear:left;"></div>
 <a href="#" onclick="eqHeight('element1', 'element2'); return false;">h&ouml;he angleichen</a>
 </body>
</html>
    online: http://murdoc.eu/javascripts/eqheight.xml
    für IE user: http://murdoc.eu/javascripts/eqheight.html
     
  12. 9. September 2008
    AW: 2 elemente sollen die gleiche höhe haben wie???

    thx jetzt hab ichs verstanden

    danke murdoc für das script

    AsAck
     
  13. Video Script

    Videos zum Themenbereich

    * gefundene Videos auf YouTube, anhand der Überschrift.