CSS andere DIV sollen bei mehr Inhalt als min-Höhe auch größer werden

AL-d82 · 07. November 2011 12:40

Hi,
wie bekomme ich es hin, das die anderen DIV Boxen die gleiche Größe der höchsten Box erlangen?
Es geht um den Hauptteil:
http://kornlupferfest.de/kornlupferfest/

Hier klicken, um den Code zum Kopieren zu markieren

{process_pagedata}
<!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" xml:lang="en" >
<head>
<title>{sitename} - {title}</title>
{metadata}
{cms_stylesheet}
</head>
<body>




<!-- OBEN -->
<div align="center">
 <div id="grundg">
   <div id="oben"> 
      <div class="oslid">
        <img src="uploads/Hintergrundbilder/Slideshow.jpg" width="950" height="185" border="0">
      </div> 
    <div class="oLogo">
        Kornlupferfest Offenau 2012
      </div> 
   
     <div class="odrueber">
         <img src="uploads/Hintergrundbilder/oben.png" width="1025" height="294" border="0">
      </div> 
      
   </div>
<!-- OBEN ENDE-->   

<!-- Haupt -->   
     <div id="haupt1">
      <div id="stengellinks">
      </div>
      <div id="Hmenue">
          <!-- start menu -->
            <div id="nav">
              {menu collapse="1" number_of_levels="1" } 
            </div>
          <!-- end menu -->
      </div>
      <div id="haupt">
           <div id="content">
              <h1>{title}</h1>
              {content} 
           </div>
      </div>
      <div id="menuerechts"> <div id="nav"> {menu  start_level="2" } </div>
      </div> 
      <div id="stengelrechts">
      </div>
     <div> 
  
<!-- Haupt ENDE--> 

 </div>
</div>

</body>
</html>

css:

Hier klicken, um den Code zum Kopieren zu markieren

 body{background-color:#202020;padding-top:50px;}
 #grundg{width:1000px;border-style:solid;
border-width:0px;min-height:800px;text-align:left;}
#oben{}
.oslid{margin-left:25px;}


.oLogo{position:relative;top:-185px;float:left;left:25px;width:300px; height:30px; background-image:url(/kornlupferfest/uploads/Hintergrundbilder/Logotrans.png);color:yellow;font-size:20px;font-family:verdana; padding-top:5px;padding-left:30px;}

.odrueber{position:relative;top:-283px;float:left;left:-13px;}

#haupt1{margin-left:20px;position:relative;width:1000px;border-style:solid;
border-width:0px;min-height:600px;top:-295px; }

 #stengellinks{float:left;width:11px;border-style:solid;
border-width:0px;min-height:600px;background-image:url(/kornlupferfest/uploads/Hintergrundbilder/StengelLinka.png);background-repeat:repeat-y; }
 #Hmenue{ float:left;width:184px;border-style:solid;
border-width:0px;background-color:#000066;min-height:600px;}
 #haupt { float:left;width:570px;border-style:solid;
border-width:0px; background-color:#3366CC;min-height:600px;}
 #menuerechts {float:left;width:184px;border-style:solid;
border-width:0px;background-color:#000066;min-height:600px;}
 #stengelrechts{float:left;width:11px;border-style:solid;
border-width:0px;min-height:600px;background-image:url(/kornlupferfest/uploads/Hintergrundbilder/stengelRechts.png);background-repeat:repeat-y;}

 #content {margin-left:10px;margin-reight:10px; }

overflow:visible; hab ich mal bei haupt1 rein macht aber nix..
Hat einer ne Idee? wink

greez AL

NaN · 07. November 2011 13:00

Wie wärs mit dem guten alten Border-Trick?

nicmare · 07. November 2011 13:47

kurzum: ist im grunde nicht möglich ohne tabellen. dort bedient man sich dann meistens einem hintergrundbild das sich vertikal wiederholt und den effekt erzeugt.

AL-d82 · 07. November 2011 13:56

Danke euch 2 für die Antworten.
Werde es mal mit Tabellen ausprobieren wink

NaN · 07. November 2011 13:59

Du lieber Himmel!
Da brauchts keine Tabelle!

...

Und dann dem haupt-Div eine Hintergrundgrafik geben die sich vertikal wiederholt.
(Oder eben mit Borders arbeiten)

mike-r · 07. November 2011 16:02

NaN schrieb:

Und dann dem haupt-Div eine Hintergrundgrafik geben die sich vertikal wiederholt.

Nennt sich Faux Columns. Beispiele und Tuts: http://alistapart.byteshift.de/fauxcolumns/ (bzw.: http://www.alistapart.com/articles/fauxcolumns/)

Es gibt auch noch andere Methoden: http://matthewjamestaylor.com/blog/equa … s-no-hacks
da muss man allerdings erstmal durchsteigen smile

Beitrag geändert von mike-r (07. November 2011 16:04)

Forum für CMS/made simple

#1 07. November 2011 12:40

CSS andere DIV sollen bei mehr Inhalt als min-Höhe auch größer werden

#2 07. November 2011 13:00

Re: CSS andere DIV sollen bei mehr Inhalt als min-Höhe auch größer werden

#3 07. November 2011 13:47

Re: CSS andere DIV sollen bei mehr Inhalt als min-Höhe auch größer werden

#4 07. November 2011 13:56

Re: CSS andere DIV sollen bei mehr Inhalt als min-Höhe auch größer werden

#5 07. November 2011 13:59

Re: CSS andere DIV sollen bei mehr Inhalt als min-Höhe auch größer werden

#6 07. November 2011 16:02

Re: CSS andere DIV sollen bei mehr Inhalt als min-Höhe auch größer werden

Fußzeile des Forums