[CSS] Linie unter bestehende Links

[web2]

Hallo zusammen,

ich bin absoluter CSS Änfänger und experementiere gerade einwenig rum. Ich habe versucht. n viele blöcke nebeneinader darzustellen. das hat soweit geklappt. jetzt möchte ich gerne genau unter diesen blöcken ein 1px dicke linie über den ganzen bildschirm haben. wie stelle ich das am besten an?

hier mein bisheriger code.

DIV.Block a
{ 
	TEXT-DECORATION: none;
	DISPLAY: block; 
	PADDING: 0 16px; 
	MARGIN: 0px;
	TEXT-ALIGN: center;
	COLOR: #666666;
	BACKGROUND-COLOR: #EFEEED;
	border-right: 1px solid #ffffff;
	float:right;
	line-height: 20px;	
}
DIV.Block a:hover 
{
	BACKGROUND-COLOR: #FFFFFF;
}

Wäre klasse wenn mir jemand helfen könnte.

 

[muhkuher]

Ich habe zwar nicht ganz verstanden, was du machen möchtest, aber einem Element eine Linie zu verpassen ist recht einfach:

div {
    border-bottom: 1px solid #000;
}

Das würde jedem div-Container einen schwarzen, unteren Rand verpassen.

Dein Codebeispiel spricht aber nur alle Links innerhalb eines div-Containers mit der Klasse "Block" an, nicht den Container selbst.

Du kannst die anweisungen übrigens auch klein schreiben, nur bei Klassen und IDs musst du auch die Groß- und Kleinschreibung achten

Für den weiteren Lernverlauf kann ich dir http://css4you.de empfehlen. Die haben ein paar recht brauchbare Workshops und auch als Nachschlagwerk lässt sich die Seite gut nutzen.

Zum Schluss dein Code-Fragment korrigiert:

div.Block { 
	padding: 0 16px; 
	text-align: center;
	color: #666;
	background-color: #efeeed;
	border-right: 1px solid #fff;
	float:right;
	line-height: 20px;	
}
div.Block a {
	color: #666;
	text-decoration: none;
}
div.Block a:hover {
	background-color: #fff;
}

 

[web2]

Hey,

vielen Dank für deinen Beitrag. Hat mir wirklich sher geholfen.