tutorials.de Buch-Aktion 05/2012
ERLEDIGT
NEIN
ANTWORTEN
7
ZUGRIFFE
824
EMPFEHLEN
  • An Twitter übertragen
  • An Facebook übertragen
DIESES THEMA IST
GESCHLOSSEN
  1. #1
    thetrue thetrue ist offline Mitglied Silber
    Registriert seit
    Mar 2006
    Beiträge
    77
    moin,

    ich habe ein Problem mit Divs:

    ich habe mehrer Divs, die neben einander liegen.
    in der Mitte ist ein Div, dessen größe sich an den Inhalt anpasst.
    wie kann ich jetzt das machen, dass die anderen Divs, die daneben liegen, gleich hoch sind wie der Div in der Mitte, also wo der Inhalt ist?

    ich habe das mit Java script gemacht:

    Code :
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    
    ...
    function make()
    {
        var height = document.getElementById('main_middle').offsetHeight;
        document.getElementById('left').style.height = height+'px';
        document.getElementById('left_main').style.height = height+'px';
        document.getElementById('left_right').style.height = height+'px';
        document.getElementById('right').style.height = height+'px';
    }
    </script>
    <body onload="make();">
    ...

    aber ich würde es gerne nur mit Css haben ...
    hier noch mein Code:
    css:
    Code :
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    
    #main
    {
        width: 800px;
        left: 50%;
        right: 50%;
        margin: auto;
    }
    #left
    {
        width: 54px;
        height:30px;
        left: 0px;
        right: 746px;
        float:left;
        background-image:url(img/left.jpg);
        background-repeat:repeat-y;
    }
    #left_main
    {
        width: 85px;
        float:left;
        height:30px;
    }
    #left_right
    {
        width: 9px;
        height:30px;
        float:left;
        background-image:url(img/middle.jpg);
        background-repeat:repeat-y;
    }
    #main_middle
    {
        width: 629px;
        float:left;
        background-image:url(img/closed_club_top.jpg);
        background-position: bottom right;
        background-repeat:no-repeat;
    }
    #right
    {
        width: 23px;
        height:30px;
        left: 779px;
        float:right;
        background-image:url(img/right.jpg);
        background-repeat:repeat-y;
    }
    html :
    HTML-Code:
    <div id="main">
    	<div id="left"></div>
    	<div id="left_main"></div>
    	<div id="left_right"></div>
    	<div id="main_middle">
    	  <p>adsfasdf</p>
    	  <p>sad</p>
    	  <p>f</p>
    	  <p>sd</p>
    	</div>
    	<div id="right"></div>
    </div>
     

  2. #2
    Maik Tutorials.de Gastzugang
    Du könntest die drei Grafiken left.jpg, middle.jpg und right.jpg in einer gemeinsamen Grafik vereinen, und diese als Hintergrundbild für ein übergeordnetes DIV verwenden. So sind die drei Spalten, unabhängig von ihrem Inhalt, optisch immer gleich hoch.
     

  3. #3
    thetrue thetrue ist offline Mitglied Silber
    Registriert seit
    Mar 2006
    Beiträge
    77
    nja, bei Firefox gehts net
     

  4. #4
    Maik Tutorials.de Gastzugang
    Warum sollte die vorgestellte Methode nicht im Firefox-Browser funktionieren?

    In dem Thread div height=100% nur im IE? habe ich erst vor ein paar Tagen ein Lösungsbeispiel für ein dreispaltiges Layout gepostet.
     

  5. #5
    thetrue thetrue ist offline Mitglied Silber
    Registriert seit
    Mar 2006
    Beiträge
    77
    nja, wenn ich es nachcode gehts auch net
     

  6. #6
    Maik Tutorials.de Gastzugang
    Könntest du auch den dazugehörigen Quelltext (HTML + CSS) posten, oder noch besser einen Link zur Problemseite nennen, damit man das Problem direkt in Augenschein nehmen kann?
     

  7. #7
    thetrue thetrue ist offline Mitglied Silber
    Registriert seit
    Mar 2006
    Beiträge
    77
    habe net mehr, habe wieder zurück gesetzt
    aber das mit Background gefällt mir nicht wirklich

    gibts ne andere Möglichkeit? auser Tabellen
     

  8. #8
    Maik Tutorials.de Gastzugang
    Sorry, wenn du deinen "nachgecodeten" Quelltext nicht zeigen willst, kann dir nur schwer geholfen werden.

    Ein (tabellenloses und lauffähiges) Beispiel für ein mehrspaltiges Layout mit gleichen Spaltenhöhen habe ich dir ja schon vorhin genannt.

    Ansonsten empfehle ich dir die Suchfunktion des CSS-Boards und den Suchbegriff: CSS-Layout.
     

Ähnliche Themen

  1. Antworten: 9
    Letzter Beitrag: 03.07.09, 12:31
  2. Höhe eines Divs: 100%- x px
    Von Superdok im Forum CSS
    Antworten: 4
    Letzter Beitrag: 28.12.07, 15:54
  3. Antworten: 3
    Letzter Beitrag: 07.05.07, 06:13
  4. Höhe von Divs - Problem
    Von Miami Vice im Forum CSS
    Antworten: 9
    Letzter Beitrag: 29.05.06, 16:42
  5. 2 Divs in der Höhe anpassen
    Von schutzgeist im Forum CSS
    Antworten: 1
    Letzter Beitrag: 24.06.05, 16:59