Abstand vom Rand in einem div . .

1 Christian

Salve Experten!

Ich wollte in einem div den Abstand zum Rand vergrössern . . .

#left {
	position: absolute;
	top: 240px;
	left: 0px;
	margin: 0px;
	padding: -5px;
	border: 1px #333 dashed;
	background-color: #FFFFFF;
	width: 150px; 
	voice-family: "\"}\"";
	voice-family:inherit;
	width: 120px;

Irgendwie funkt das nicht so ganz wie ich möchte . . ändere ich den padding, ändert sich die Position des div . . .

2 Jörg Kruse

So ganz verstehe ich das Problem noch nicht:

Wenn du den Abstand zum Rand veränderst, dann ändert sich doch zwangsläufig die Position?

3 Christian

Ja, aber die Position des div's und nicht des Textes! Ich möchte den Text nicht am Rand haben sondern 2-3px vom Rand weg, damit es nicht so angeklebt ausieht . . .

Was du beachten musst, ist, dass die Browser das Padding zur Angabe von width hinzurechnen, um die Gesamtbreite zu ermitteln. Wenn die Gesamtbreite des Divs gleich bleiben soll, und du das Padding um 3px erhöhst, musst du 2 x 3px von width wieder abziehen

5 Christian

Ich komme mit dem Rand einfach nicht klar :-( . Unter http://www.rsg-instructor.ch findet Ihr die Seiten.

Ich möchte einerseits, dass die äusseren div's nicht so am Rand kleben und andererseits, dass der Text in den Div's etwas Absatnd zum Rand hat.

Dann habe ich folgendes festgestellt: Geht mal auf das Stichwortverzeichnis und schaut Euch den rechten Div (extra) und den Footer an: Die überschneiden sich ja!

6 Jörg Kruse

Die Abstände kannst du mit der CSS-Eigenschaft padding herstellen.

Z.B. für einen äußeren Rand über ein Padding von body:

body{
font: 10px Verdana, Arial, Helvetica, sans-serif;
background-color: #000000;
padding:0 10px;
}

... und für die Abstände der Textes über ein Padding der betreffenden Divs, z.B. für das div#extra:

div#extra{float:right;width:150px;margin-left:-200px; padding:10px;}

Zur Überlappung des Footers:

Das Element div#extra hat die Eignschaft float:right - der Footer muss deswegen auch den rechte Umfluss beenden, also ein clear:both aufweisen:

div#footer{
clear:both;
width:100%;
background-color: #333333;
}

PS: die doppelten body und /head Tags solltest du noch entfernen:

</head>

<body>

</head>
<body>

7 Christian

Salve!
Danke für die rasche Antwort! Hat alles geklappt bis auf clear:both; , schau einfach mal rein . . . jetzt hängt der Div extra an der Oberkante vom footer :-D

Dein Vorschlag?

8 Jörg Kruse

Nicht div#extra soll das clear:both, als Eigenschaft erhalten, sondern div#footer - so wie ich es oben angegeben habe

9 Christian

ups . . .

nach oben

Beitrag schreiben (als Gast)

Verwandte Themen
Thema	Autor	Forum	Beiträge	Letzter Beitrag
Wie kann ich einen Text mit einerm Rand versehen?	Günter Leipfinger	HTML und CSS	6	28.11.2017 11:05
Navigationsbox verändern	krieger	HTML und CSS	3	02.01.2017 20:44
Link wird über den Boxenrand geschoben	krieger98	HTML und CSS	6	21.12.2015 20:57
CSS: Verschiedene Browser unterschiedliche Abstände	Jörg Kruse	HTML und CSS	14	16.02.2012 19:41
abstände festlegen	zaubercore	HTML und CSS	6	08.10.2011 17:31
Rand unterschiedlich darstellen	Christian	HTML und CSS	5	24.01.2007 19:41
Merkwürdiger Abstand	Isildur	HTML und CSS	14	02.05.2006 21:13

Abstand vom Rand in einem div . .

Beitrag schreiben (als Gast)

Verwandte Themen