vertikale linie?

Status
Nicht offen für weitere Antworten.

mille

Erfahrenes Mitglied
Hey leute.

Ich hab ein Problem in Bezug auf CSS (und divs)

Nun, ich werde das problem schildern und hoffe ihr könnt helfen :)

Mein "inhaltsfenster" besteht aus einem DIV, genannt ContentPane, welches eine Überschrift, eine Subüberschrift und 3 Spalten beinhaltet. diese sind Ebenfalls DIVs.
Das klappt insoweit auch alles prima.

Nun möchte ich zwischen den Spalten (also quasi links und rechts von der mittleren) eine Vertikale schwarze Linie setzen (ihr kennt so etwas aus einer Zeitung) die genausolang ist, wie die DIVs, welche die spalten darstellen. Ich bezeichne dieses DIV einfach mal als spalte.

Ich habe mir gedacht ich werde zwischen den 3 spalten :
Code:
<div class="spalte">- inhalt -</div> ....<div class="spalte">- inhalt -</div> ....<div class="spalte">- inhalt -</div>

folgenden Code setzen (also da wo die ... sind):

Code:
<div style="float: left; width: 1px; max-width: 1px; height: 100%; background-color: #000000">&nbsp;</div>

Beim firefox wird die schwarze linie viel zu weit gezogen. Beim Internetexplorer ist sie nur ca 20 px hoch und gleiches gilt für Opera.

ich habs auch schon mit height: inherit probiert, aber das bringts auch nicht.

Damit ihr euch ein überblick schaffen könnt noch die CSS definition für die Contentpane (class=inhalt) und für die spalten

Code:
.spalte {
	font:			Arial, "Times New Roman", Times, serif;
	font-size: 		12px;
	font-weight: 	normal;
	color: 			#000000;
	text-align: 	justify;
	white-space: 	normal;
	margin: 		5px;
	padding: 		2px;
	width: 			160px;
	float: 			left;
	z-Index:		1;
}
.inhalt {
	margin-top: 	20px;
	margin-bottom: 	20px;
	margin-right: 	auto;
	margin-left: 	auto; 	
	background: 	#EBEAD9;
	border: 		1px solid #ffffff;
	text-align:		left; 
	width: 			530px;
	height: 		auto;
	z-Index:		1;
}
.clearDiv{ 
	line-height: 	0;
    font-size: 		1px;
    height: 		0;
    clear: 			both;
	z-Index:		1;
}

Achja, ein ClearDiv ist noch ganz am ende nach der letzten spalte eingefügt, damit sich die Höhe des ContentPanes anpasst.

ich hoffe ihr koennt mir helfen
 
Hola,

ganz blöde Frage, vielleicht habe ich dich falsch verstanden, aber warum gibst du der mittleren Spalte nicht eine ID wie #mittlereSpalte, die dann border-left:xxx und border-right:xxx definiert?

Oder denk ich jetzt grad ZU einfach?

Das einzige Problem, das ich sehe ist, wenn die drei Spalten unterschiedlich lang sind und du den Strich aber bis zum längsten DIV runter haben willst....das könnte Probleme geben ;-)
Ausser du beschränkst deinen Content in den Spalten auf eine maximale Zeichenlänge.

Greetz Dani
 
Zuletzt bearbeitet:
Status
Nicht offen für weitere Antworten.
Zurück