Spalten sollen sich nicht überlappen

[Schorsch]

Hallo,

ich möchte ein zweispaltiges Layout.

Die linke Spalte ist 15em breit und floatet links.
Die rechte Spalte soll rechts davon sein. Das tut sie nicht (Opera, IE6):

<div style='float:left; width:15em; margin-right:0.5em; border:1px solid #0a0; background:#ffd'>links</div>  
<div style='border:1px solid #a00; background:#fdd'>mitte<br>mitte<br>mitte<br></div>  
<div style='clear:both'>clear</div>  
<br>  

Sowohl der Rahhmen als auch die Hintergrundfarbe der rechten Spalte belegen die gesamte Bildschirmbreite. Lediglich der Text floatet um die linke Spalte.

Ich möchte, dass die rechte Spalte rechts bleibt. Lediglich, wenn das Fenster zu schmal ist, soll die rechte Spalte unter die linke rutschen. Damit verbietet sich wohl ein margin-left?

Gruß,
Schorsch

[juliaa]

Hallo,

ich möchte ein zweispaltiges Layout.

Die linke Spalte ist 15em breit und floatet links.
Die rechte Spalte soll rechts davon sein. Das tut sie nicht (Opera, IE6):

<div style='float:left; width:15em; margin-right:0.5em; border:1px solid #0a0; background:#ffd'>links</div>

<div style='border:1px solid #a00; background:#fdd'>mitte<br>mitte<br>mitte<br></div>
<div style='clear:both'>clear</div>
<br>

>   
> Sowohl der Rahhmen als auch die Hintergrundfarbe der rechten Spalte belegen die gesamte Bildschirmbreite. Lediglich der Text floatet um die linke Spalte.  
>   
> Ich möchte, dass die rechte Spalte rechts bleibt. Lediglich, wenn das Fenster zu schmal ist, soll die rechte Spalte unter die linke rutschen. Damit verbietet sich wohl ein margin-left?  
>   
> Gruß,  
> Schorsc  
  
<div id="GESAMTSEITE">  
<div  style='float:left; width:15em; margin-right:0.5em; border:1px solid #0a0; background:#ffd'>links</div>  
<div style='border:1px solid #a00; background:#fdd'>mitte<br>mitte<br>mitte<br></div>  
<div style='clear:both'>clear</div>  
<br>  
</div>  
  
probier mal so :)

[Schorsch]

<div id="GESAMTSEITE">
<div  style='float:left; width:15em; margin-right:0.5em; border:1px solid #0a0; background:#ffd'>links</div>
<div style='border:1px solid #a00; background:#fdd'>mitte<br>mitte<br>mitte<br></div>
<div style='clear:both'>clear</div>
<br>
</div>

probier mal so :)

Nein, ändert nichts. An welche CSS- Angaben denkst du denn bei
#GESAMTSEITE {}

[Gunnar Bittersmann]

@@juliaa:

nuqneH

<div id="GESAMTSEITE">

Völlig unnötig.

Qapla'

[suit]

Völlig unnötig.

Genauso wie:

<div style='clear:both'>clear</div> und das folgende <br>

Für manche Formatierungsvorhaben ist man aber leider auf zusätzliche Elemente angewiesen, die unterstützung von ::outside ist leider noch nicht sehr vorangeschritten.

[ChrisB]

Hi,

Die linke Spalte ist 15em breit und floatet links.
Die rechte Spalte soll rechts davon sein. Das tut sie nicht (Opera, IE6):

Sowohl der Rahhmen als auch die Hintergrundfarbe der rechten Spalte belegen die gesamte Bildschirmbreite. Lediglich der Text floatet um die linke Spalte.

Das ist bei float auch erst mal der Normalfall.

Ich möchte, dass die rechte Spalte rechts bleibt.

http://aktuell.de.selfhtml.org/weblog/css-spaltenlayout#mehrspaltigkeit-mit-float

MfG ChrisB