2 Column Layout

06/24/2012 02:48 boxxiebabee#1
Servus, hab nen "kleines" Problem.

Und zwar es geht darum das ich 2 Divs nebeinander platziert hab (float). Nun möchte ich aber das der rechte Div den restlichen Platz einnimmt.
Das wäre ja bist jetzt noch kein Problem, wenn denn der linke Div eine vordefinierte Weite hätte, die hat er leider nicht da dort die Menü-Einträge reinkommen und somit ist die Weite vom Div dynamisch. Ansonsten könnte man ja mit Margin arbeiten.

Das ganze sollte mit CSS2 gelöst sein (JS wäre in dem Fall ja wie Cheaten :D).

Hat ja jemand ne Idee? Steh grad ziemlich am Schlauch. :\
06/24/2012 14:03 FancyArts#2
Kannst du uns nicht ein paar Schnipsel zeigen...?
Außerdem verstehe ich nicht genau, was du willst...

Also es soll so aussehen...

Und wo hast du das Problem, bzw. was passiert?
06/24/2012 16:08 DeepBlocky#3
Dass der Text recht eben die ganzen 100 % ausfüllen soll, und da nicht immer eine Lücke sein soll ;)
Das ist das Problem :D
06/24/2012 22:17 FancyArts#4
Mach es doch als "container"...
Also so :

PHP Code:
.content .container {
    width: xxpx;
    height: xxpx;
    float: left;
    margin-top: xxpx;
    margin-left: xxpx;
} 
Und genau du hast gemeint, dass ich kein CSS oder ähnliches kann... aber na ja, ist ja nun auch egal.
06/24/2012 22:18 PseudoPsycho#5
Wow, das ist wirklich schwer...
Das gelingt nichtmal mir auf die Art :D

Ich würde höchstens die Aufgabenstellung verändern und letztlich sowas draus machen:
HTML Code:
<!Doctype html>
<html lang="de">
	<head><title>Test</title></head>
	<body>
		<div style="width:100%; background:rgb(260, 0, 0); display:table;">
			<div style="display:table-row; width:100%;">
				<div style="background:rgb(0, 260, 0); display:table-cell;">bla</div>
				<div style="background:rgb(0, 0, 260); display:table-cell;">xyz</div>
				<div style="clear:both;"></div>
			</div>
		</div>
	</body>
</html>
Quote:
Originally Posted by FancyArts View Post
PHP Code:
.content .container {
    width: xxpx;
    height: xxpx;
    float: left;
    margin-top: xxpx;
    margin-left: xxpx;
} 
Ähm, wieso schreibst du nur "xx", wenn genau danach gefragt ist?? :O
06/25/2012 00:15 boxxiebabee#6
@Pseudo

Hey, so weit war ich auch schon mit display: table-cell etc. nur da kann ma ndann kein margin etc. verwenden, sondern nur border-spacing was nicht so toll ist.

Also hier nochmal nen Beispielbild was ich erreichen möchte:
[Only registered and activated users can see links. Click Here To Register...]

Hoffe ihr versteht es, und es gibt ne Lösung dafür (ohne JS). Hab zwar schon recht lange gegoogelt aber leider nix gefunden.
06/25/2012 15:03 FancyArts#7
Mhh... soll der Text den Container voll ausfüllen, oder der Conateiner die restlichen 100% der Seite einnehmen?

Doch sowas?

PHP Code:
.content {
    width: 800px;
    height: 330px;
    padding: xxpx xxpx xxpx xxpx; (z.B. : 20, 40, 20, 40)
}

.content .container {
    width: 800px;
    height: 350px;
}

.content .container #home {
    float: left;
    margin-top: xxpx;
    margin-left: xxpx;
}