[CSS] Div Bereich nur um 1 Div Element

[Floriam]

Hallo,


Ich habe einen Div gemacht, für einen Inhaltsbereich. In diesem Div sind 2 Zeilen, einmal für den Titel, und einmal für den eigentlichen Text.

	<div class="content_box">
		<div class="content_title">	
			$etitle
		</div>
		<div class="content_text">
			$text
		</div>
	 </div>

Hier die CSS definitioon der Klassen:

.content_title {
	padding: 3px 3px;
	background-color: #8295BD;
	color: #FFFFFF;
	font-weight: bold;
	letter-spacing: 2px;
}

.content_text {
	padding: 3px 3px;
	background-color: #8295BD;
	width: 98%;
	float: right;
}

.content_box {
	background-color: #8295BD;
}

Der Textbereich soll nur 98% groß sein, da ich die restlichen 2% mit der Hintergrundfarbe der Box fülle...


Wenn ich jetzt aber z.B. einen Rand um content_box mach, dann wird nur die Titelzeile eingerahmt, also scheint der <div> nur für content_title zu gelten, wieso nicht auch für content_box?


Floriam

[wahsaga]

Re: [CSS] Div Bereich nur um 1 Div Element

wenn du content_text floaten lässt, nimmst du es damit aus dem elementfluss heraus, es beeinflusst also die höhe seines elternelementes nicht mehr ...

[Floriam]

Danke!

Ich hab keine Ahnung, wozu ich das float: ...; mal gebraucht hab

EDIT:

---

Mist, ich habs doch gebraucht, gibts ne Möglichkeit das so zu machen? (mit float)

---

[mrhappiness]

probier statt content_box einfach mal body

warum brauchst du float?

[Floriam]

probier statt content_box einfach mal body

Geht leider nicht, da content_box eine Box mit Text ist, welche in ein Design (mit Navi, Footer, Header usw.) eingefasst ist...

warum brauchst du float?

Das Element soll 98% groß sein, 2% also noch frei für anderes. Der Rest wird dann mit einer Farbe gefüllt (also eine Art Rand). Das ganze soll dem Design meiner Navi gleichen. Ist nicht umbedingt notwendig, ich kanns auch rausnehmen. Allerdings könnte es ja sein, dass ich nochmal das Problem hab...

border: ...; kann ich leider nicht nehmen (lässt als größe nur px, usw. zu, aber nicht %)

[wahsaga]

Original geschrieben von Floriam
border: ...; kann ich leider nicht nehmen (lässt als größe nur px, usw. zu, aber nicht %)

das wäre mir neu.

border-width verlangt laut selfhtml eine "nummerische angabe", und dazu zählt z.b. auch eine angabe in %.

[Floriam]

Mhn, ich hab den folgenden Code jetzt für den Text:

.content_text {
	padding: 3px 3px;
	background-color: #425882;
	width: 90%;
	float: right;
	color: #FFFFFF;
	border-left-color: #8295BD;
	border-left-width: 10%;
	border-left-style: solid;
}

EDIT:

---

Ganz vergessen: Funktioniert nicht richtig, ich hab einen kleinen Rand (aber viel zu klein für 10%)

---

[wahsaga]

Original geschrieben von Floriam
Ganz vergessen: Funktioniert nicht richtig, ich hab einen kleinen Rand (aber viel zu klein für 10%)

ich vermute eher, dass du zwar 10% hast, aber von einer ausgangsgrösse, die sehr viel kleiner ist als du annimmst.

wo hast du denn die höhe des bereiches festgelegt?

[Floriam]

Die Höhe ist nicht definiert (wie auch bei einem dynamisch generierten Bereich?), es könnte gut sein, dass die 10% von der Höhe ausgehen, allerdings kann ich meinen Bereich auch 20x so hoch machen, die leiste verändert sich trotzdem nicht...

[Floriam]

Mhn, irgendwie bin ich schon ein bisschen blöd...

Ich hab einfach mal bei der Navi geschaut (welche ja die Vorlage war), und ein bisschen umgebaut, und schon geht alles...