Positionierungsproblem

[Benny]

Hallo,
ich wäre über Hilfe mal wieder sehr dankbar. Es geht um ein Positionierungsproblem mittels CSS. Auch wenn es zahlreiche "Spaltenbeispiele" gibt (auch auf SelfHTML) habe ich nicht das richtige gefunden.

Ich möchte auf meiner Seite ein 2-spaltiges Layout, die nebeneinander stehen. So weit, so gut. Aber jetzt ist es so, dass nicht wie so oft, die linke Spalte fix sein soll, sondern die rechte Spalte. Sprich die linke Spalte sollte eine variable Breite haben.

Meine Versuche endeten hier:

  
#inhalt_rechts {  
	float:right;  
	width:150px;  
	border:1px solid #444;  
	margin:20px 50px 50px 10px;  
	padding:15px;  
	font-size:1.4em;  
	line-height:1.2em;  
	}  
		  
#inhalt_links {  
	margin:20px 5px 50px 50px;  
	border:1px solid #444;  
	padding:15px;  
	line-height:1.6em;  
	font-size:0.9em;  
	text-align:justify;  
	min-width:300px;  
	}  

  
<div id="inhalt_rechts">Inhalt mit fixer Breite</div>  
<div id="inhalt_links">Inhalt mit variabler Breite</div>  

• Meine Lösungsidee war zum einen das 2-Spalten-Layout aus SelfHTML rauszukopieren und einfach die Spalten zu vertauschen und "float" anzupassen und die Reihenfolge ändern --> aber die Spalten waren nicht nebeneinander.

• Meine zweiter Lösungsversuch mit einem 3-Spalten-Layout und die linke Spalte einfach auf 1% zu setzen ist nicht wirklich gut programmiert.

Wär super, wenn mir jemand helfen könnte. Ich befürchte, dass es eine "ganz einfache" Lösung gibt, aber irgendwie steh ich aufm Schlauch.

Vielen Dank
Gruß Benny

[Felix Riesterer]

Lieber Benny,

wenn Du von Spalten sprichst, dann heißt das doch, dass die "rechte Spalte" bis zum unteren Ende reichen soll, oder?

#inhalt_rechts {
float:right;

Dann halte ich float für keine optimale Lösung. Nimm den rechten Inhalt per position:absolute und passenden top- bzw. right-Werten nach rechts, verpasse der "linken Spalte" einen passenden margin-right oder padding-right-Wert - und gut ist!

Mit einem passenden Hintergrundbild kannst Du dann die rechte Spalte visuell nach unten verlängern, auch wenn das Element längst nicht die Ausdehnung nach unten hat.

Noch Fragen?

Liebe Grüße,

Felix Riesterer.

[Benny]

wenn Du von Spalten sprichst, dann heißt das doch, dass die "rechte Spalte" bis zum unteren Ende reichen soll, oder?

Wie groß diese wird, will ich mir noch offen halten, aber es kann gut sein, dass sie bis zum unteren Rand gehen wird.

Dann halte ich float für keine optimale Lösung. Nimm den rechten Inhalt per position:absolute und passenden top- bzw. right-Werten nach rechts, verpasse der "linken Spalte" einen passenden margin-right oder padding-right-Wert - und gut ist!

Ich wollte eigentlich das "position:absolute" umgehen.

Trotzdem Danke für die Antwort.
Gruß Benny

[Felix Riesterer]

Lieber Benny,

Wie groß diese wird, will ich mir noch offen halten, aber es kann gut sein, dass sie bis zum unteren Rand gehen wird.

ich habe Dein Vorhaben im Prinzip (nur seitenverkehrt) schon umgesetzt. Du kannst es ja einmal studieren...
Beispiel mit kurzer Spalte | Beispiel mit langer Spalte

Liebe Grüße,

Felix Riesterer.

[Benny]

ich habe Dein Vorhaben im Prinzip (nur seitenverkehrt) schon umgesetzt. Du kannst es ja einmal studieren...
Beispiel mit kurzer Spalte | Beispiel mit langer Spalte

Also ich muss ganz ehrlich zugeben, ich checke das Beispiel grad nicht. Aber ich möchte auf jeden Fall vorab Danke für die Hilfe sagen. Einem Helfenden zu sagen "Hä? Das blick ich jetzt nicht" klingt nämlich immer so abwertend. Ich bin so selbstkritisch, dass ich das Problem wahrscheinlich eher bei meiner Unwissenheit suchen muss.

Aber mein Spaltenproblem habe ich, wie gesagt, bei der Seite echt nicht rauslesen können.

Vielleicht erklär ichs nochmal an einem Beispiel

Mein Wunsch:

|-------------------------------|

Header
Spalte mit
flexibler Breite
(abhängig vom
Browserfenster)
-------------------------------
Fußzeile
-------------------------------

Aber wie gesagt, trotzdem noch mal vielen Dank Felix.

Gruß Benny

[Malcolm Beck´s]

hi,

Mein Wunsch:

|-------------------------------|

Header
Spalte mit
flexibler Breite
(abhängig vom
Browserfenster)
-------------------------------
Fußzeile
-------------------------------

Meinst du vielleicht so?

mfg

[Benny]

Ich habe das Problem gelöst.
Zwar jetzt auf eine andere Weise, weil ich das Design etwas abgeändert habe, aber egal :-)
ich hab meinem Inhaltsbereich (sprich der linken Spalte) jetzt doch eine feste Breite gegeben, damit es mir mein Design bei einer sehr großen Auflösung nicht komplett zerhaut.

Ich glaub, dass ist so dumm nicht.

Wie gesagt, trotzdem nochmal vielen Dank für die Hilfe.
Gruß Benny