Einzelnen Beitrag anzeigen
  #1 (permalink)  
Alt 19.11.2006, 17:40
radon radon ist offline
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 18.11.2006
Beiträge: 32
radon befindet sich auf einem aufstrebenden Ast
Standard Felder Anordnung Problem

Scheinbar habe ich nicht genügend klar fomuliert:

meine site sollte eine einfache Stuktur haben:

- drei "Spalten"
- 1 "Spalte": 3 Zeilen
- 2 "Spalte": 1 Zeile
- 3 "Spalte": 1 Zeile


Ich habe das schon oft gemacht. Kein Problem.
Der Unterschied ist jetzt jedoch, dass die zweite Zeile in der ersten Spalte scrollt d.h. ein <ul> Container ist.
Es gelingt mir nicht die 3 Spalte oben auszurichten ohne dass das Scrollfeld verzogen wird.
Clear habe ich versucht...
Danke

HTML:
Code:
<div id="titelfeld">  
  <h1>Resultate</h1>
</div>

<ul id="resultatecontainer">  <!--mit Scroller, -->
  <li><a href="resultat1.htm">Resultat 1</a></li>
  <li><a href="resultat1.htm">Resultat 2</a></li>
  <li><a href="resultat1.htm">Resultat 3</a></li>
  <li><a href="resultat1.htm">Resultat 4</a></li>
  <li><a href="resultat1.htm">Resultat 5</a></li>
</ul>
</div>
<div id="feldunterresultate">  
  <h1>hier</h1>
  <h2>Kommentare<h2>
</div>
<div id="rechtesfeld">
  <p>hier rechtes feld </p>
</div>
<div id="mittleresfeld">
  <p>hier</p>
</div>
und das CSS:
Code:
body, p a {
    color: black; background-color: white;
    font-size: 100.01%;
    font-family: Helvetica,Arial,sans-serif;
    margin: 0; padding: 1em 0;
    text-align: center;  /* Zentrierung im IE */
  }
  div#page {
    text-align: left;    				
    margin: 0 auto;      				
    width: 900px;
    padding: 0;
    border: 0px;
  }
 
  ul#resultatecontainer { 			
    overflow:auto; 					/*scroller*/
	height: 200px;
	width: 18em;	
	float: left; width: 14em;
	margin: 0 0 1.3em; padding: 0em;		
	clear: both;
	border-bottom: 10px solid #E4E2EE;
  } 
  div#feldunterresultate { 						
	float: left; width: 14em;
	clear: both;
  } 
    

  div#rechtesfeld {
	float: right; width: 120px;

  }

  div#mittleresfeld {
    margin: 0 12em 1em 15em;
    padding: 0 1em;
    border: 1px solid #E4E2EE;
  }
Mit Zitat antworten
Sponsored Links