✔ andere Möglichkeit für word spacing ...
- Themenstarter buddha
- Beginndatum
- Status
M
Maik
Hierfür empfehle ich dir die margin-Eigenschaft, wie z.B.
Code:
a {
text-decoration:none;
color:#FFFFFF;
margin:0 10px; /* Aussenabstand oben/unten = 0, links/rechts = 10px */
}
M
Maik
Ich hab gerade den Eindruck, dass wir hier aneinander vorbei reden, denn dieser Punkt war doch schon geklärt, und nun ging es um den Abstand zwischen den einzelnen Links.
Mit der float:right-Eigenschaft kannst du derzeit nichts bewirken, da das rechte Bild ein Hintergrundbild und kein Grafikelement (img) ist, das auf diese Weise formatiert werden könnte.
Mit der float:right-Eigenschaft kannst du derzeit nichts bewirken, da das rechte Bild ein Hintergrundbild und kein Grafikelement (img) ist, das auf diese Weise formatiert werden könnte.
Hallo,
Auf dem Foto kann man einen Abstand zwischen der Navigationsleiste und dem Text sehen (ca.10px). Im IE wird es allerdings ohne Abstand angezeigt, das wäre in diesem Fall korrekt.
CSS Layout
HTML
.Gruß Rico
Auf dem Foto kann man einen Abstand zwischen der Navigationsleiste und dem Text sehen (ca.10px). Im IE wird es allerdings ohne Abstand angezeigt, das wäre in diesem Fall korrekt.
CSS Layout
Code:
body {
background-color: #006633;
}
#content {
width:900px;
margin: 30px auto 20px auto;
}
#logo {
background-image: url(../bilder/header.jpg);
background-repeat:no-repeat;
background-position:center;
border: #003300;
border-style:inset; border-width: thick;
margin-bottom:0px;
margin-top:0px;
}
h1 {
font-family:Arial, Helvetica, sans-serif;
color:#FFFFFF;
font-style:italic;
font-size:36px;
margin-top:5px; /* Abstand zum Logo*/
}
#wald {
background-image:url(../bilder/wald.jpg);
background-repeat:no-repeat;
background-position: right;
}
#text {
color:#000000;
background-color:#FFFFFF;
font-family:Arial, Helvetica, sans-serif;
font-style: normal;
font-size:12px;
width:910px;
margin-top:0px;
padding-bottom:10px;
}
#text p {
padding-right: 30px;
padding-left:20px;
}
#end {
background-color: #339933;
width: 910px;
height:20px;
color:#000000;
}
/* navigation gruen css */
#button {
background-color: #339933;
font-family:Arial, Helvetica, sans-serif;
font-style:normal;
font-size:14px;
width:910px;
height:20px;
margin-bottom:0px;
}
a {
text-decoration:none;
color:#FFFFFF;
margin:0 35px; /* Aussenabstand oben/unten = 0, links/rechts = 10px */
}
a:link, a:visited {
text-decoration: underline;
color:#FFFFFF;
}
a:focus {
color: #000000;
}
a:hover {
text-decoration: none;
}HTML
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Grün mit CSS</title>
<link href="css/layout.css" rel="stylesheet" type="text/css" />
<link href="css/navigation.css" rel="stylesheet" type="text/css"/>
</head>
<body>
<div id="content"> <img id="logo" src="bilder/header.jpg" alt="Wasserfall" />
<h1 align="center">Hier den Namen eintragen </h1>
<div id="button">
<div align="center"> <a href="index.html">Start</a> <a href="leistung.html">Leistung</a> <a href="produkte.html">Produkte</a> <a href="Kontakt.html">Kontakt</a> <a href="referenzen.html">Über uns</a> <a href="impressum.html">Impressum</a></div>
</div>
<div id="text">
<div id="wald"> <img src="bilder/wald.jpg" alt="Wald" width="150" height="150" hspace="2" vspace="2" align="right" id="wald"/> </div>
<p><br />
Lorem ipsum dolor sit amet, consectetuer adipiscing elit.</p>
</div>
<div id="end" >
<div align="center">Test</div>
</div>
</div>
</body>
</html>.Gruß Rico
Anhänge
M
Maik
Setz mal für das Blockelement p den Außenabstand auf null:
Code:
#text p {
padding-right: 30px;
padding-left:20px;
margin:0;
}- Status
