<Div> mit 100 % höhe

simon117 · 14.09.2010

Hallo PSD Tut's,

ich habe folgendes Problem ich möchte das meine "Testhomepage".Wenn ein Inhaltselement angelegt wird die Div's "mitwachsen" also Rechts und Links.Links im Div ist eine Navi und Links sollen shoutnews angezeigt werden.Ich benutze das Contentmanagesystem Typo3 aber das Problem liegt ja eindeutig in der CSS datei

Stehe dann vor dem Problem wie mache ich das richtig? Bzw wie kriege ich das hin mit:

Code:

height:100%;

?

Wäre um Hilfe sehr dankbar

Hier die CSS:

Code:

h2,h3,h4,h5,h6,div,p,body,html,input,button { 
    font: normal 12px Helvetica,Verdana,Arial 
}

h1 { 
    font: normal 14px Helvetica,Verdana,Arial;
    font-weight: bold;
}

body{
    text-align:center;
}

div#container {
  width:980px;
  text-align:left; 
  margin:0px auto;
  border:1px solid silver;
  background: url(../fileadmin/Posner/images/background.jpg) repeat-y;
}

div#top {
  font: bold 10px Verdana,Arial;
  clear:both;
  background-color:#5E7E9E;
  text-align:right;
  color:#FFFFFF;  
  padding:5px;
  padding-right:10px;  
}

div#top  {
   text-decoration: none;
   color:white;
}

div#header { background-color:white; }

div#links { 
    float:left;
    width:178px;
    height:75%;
    padding-top:37px;
    padding-bottom:10px;
    background-color:#335C85;
}

div#center { 
    float:left;
    width:600px; 
    padding:10px;
}

div#head { 
    font: normal 10px Helvetica,Verdana,Arial;
    text-align:right;
}

div#right { 
    float:left;
    width:160; 
    height:77%;
    padding:10px;
    background-color:#335C85;
}

div#footer {
  clear:both;
  background-color:#5E7E9E;
  padding:2px;
}

div#links_bottom{
    text-align:center;
    background-color:#8BA2BA;
    margin-top:20px;
    padding-top:1px;
    padding-bottom:1px;
}

.linkWeiss {
    font-style: arial;
    color:#FFFFFF;
}

.float-left { 
    float:left; 
}

/* Anpassungen IE */

*html div#container {
  width:982px;
}

*html div#center { 
    float:left;
    width:620px; 
}

fexx · 14.09.2010

AW: <Div> mit 100 % höhe

es heißt "height" ;-)

kannst du mal bitte denk link zur testpage schicken ... ich checks noch nicht so ganz ;-) welche boxen wo und wie sind ;-)

simon117 · 14.09.2010

AW: <Div> mit 100 % höhe

fexx schrieb:
es heißt "height" ;-)

kannst du mal bitte denk link zur testpage schicken ... ich checks noch nicht so ganz ;-) welche boxen wo und wie sind ;-)

Leider ist die Page mit eine Hpps Abfrage verbunden und müsste dir dafür die Zugangsdaten geben.

Also ich kann ein Screen machen wäre das auch ausreichend?

fexx · 14.09.2010

AW: <Div> mit 100 % höhe

entweder du schickst mir die daten per pn oder wir versuchens mit dem screen

sokie · 14.09.2010

AW: <Div> mit 100 % höhe

1. ohne html kann man nur spekulieren, wie die Elemente im Zusammenhang stehen.
2. die Frage ist doch immer von was (100%,77%...) Prozentuale Werte kannst du nur dann gebrauchen, wenn das Elternelement eine feste Höhenangabe hat.
3

*screen ist uninteressant, kopier den html code der seite

simon117 · 15.09.2010

AW: <Div> mit 100 % höhe

HTML:

<html>
    <head>
        <title>Deutsche TYPO3 Dokumentation</title>
        
        <link rel="stylesheet" type="text/css" href="fileadmin/Posner/CSS/style.css" />
    </head>
    <body>
          
    <!-- ###DOKUMENT### begin -->
      
    <div id="container">
            
            <div id="header">
                <img src="../fileadmin/Posner/images/logo.jpg" width=180" height="110"> 
            ###TRAILER###
        </div>
          
          <div id="top">
                    ###MENU_OBEN###
              </div>
      
              <div id="links">
            ###MENU_LINKS###
            </div>      
    
            <div id="center">
                ###MITTE_CONTENT###
            </div>
     
        <div id="right">
                ###RECHTS###
            </div>
        
        <div id="footer">
            ###FOOTER###
        </div>
            
        </div>
    </div>    
    
    <!-- ###DOKUMENT### end -->
    
    </body>

</html>

Landorien · 15.09.2010

AW: <Div> mit 100 % höhe

1. Doctype fehlt -> Quirks-Modus ensteht dadurch wird nicht alles korrekt angezeigt

2. div-Suppe -> Wozu benötigst du soviele div-container?

simon117 · 20.09.2010

AW: <Div> mit 100 % höhe

Wäre es angebracht den Script mit <Tr> und <Th> zumachen? Bloß ich bin noch nicht so richtig drin in <table>.Ich habe es in der Schule alles mit <div> gelernt.Deswegen die <Div> Suppe!!

Könnte mir jemand vielleicht helfen wie ich das Problem lösen könnte.

TomorrowGraphics · 20.09.2010

AW: <Div> mit 100 % höhe

Nene, lass blos die Tables aus dem Spiel

unter dem IE müsste das eigentlich mit height:100%; funktionieren
Für die anderen Browser müsstest du zusätzlich min-height:100%; benutzen.
achja... wenn der Div#Container auf 100% soll, dann müsstest du zusätzlich noch dem Body 100%ige höhe zuweisen.

Landorien schrieb:
2. div-Suppe -> Wozu benötigst du soviele div-container?

Naja, sieht aus wie ein dreispaltiges Design...
was stört dich daran? Der Container?
Oder Div#top?
Versteh nicht was daran falsch oder schlecht sein soll...
Wenn ich ein Grafisches Design mache und dann für Header, Content und Footer jeweils noch einen Wrapper nutze kommt da manchmal noch mehr zustande^^

edit:
ach ja... Landorien hat recht.. Ohne Doctype kommt es schnell mal zu fehlerhaften Darstellungen. Auf jeden fall einfügen!