Nicht mehr ganz neu hier
Moin.
Ich hab mal wieder zwei kleine Probleme mit meinen Div´s bei der Darstellung im FF sowie/oder im IE6...
Im Firefox werden die Div´s richtig positioniert, bis auf den Contend Div, der sollte eigentlich 5px weiter oben stehen, tut er aber nicht...
Ich denke das Problem wird von den Floats, bzw. dem Clear her rühren...
Im Ie werden leider alle Div´s mehrere px nach unten verschoben, aber hier passt wieder der abstand zwischen dem Contend Div und den darüber liegenden Div´s...
Hier mal mein HTML:
sowie CSS:
Hoffe mir kann einer von euch helfen!!!
Ich hab mal wieder zwei kleine Probleme mit meinen Div´s bei der Darstellung im FF sowie/oder im IE6...
Im Firefox werden die Div´s richtig positioniert, bis auf den Contend Div, der sollte eigentlich 5px weiter oben stehen, tut er aber nicht...
Ich denke das Problem wird von den Floats, bzw. dem Clear her rühren...
Im Ie werden leider alle Div´s mehrere px nach unten verschoben, aber hier passt wieder der abstand zwischen dem Contend Div und den darüber liegenden Div´s...
Hier mal mein HTML:
HTML:
<!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=UTF-8" />
<title>PastellCrossTemp</title>
<link rel="stylesheet" type="text/css" href="style.css" />
</head>
<body>
<div id="wrapper">
<div id="head"></div>
<div id="nav">
<a href="index.html" target="_self">Link 1</a><br /><br />
<a href="index.html" target="_self">Link 2</a><br /><br />
<a href="index.html" target="_self">Link 3</a><br /><br />
<a href="index.html" target="_self">Link 4</a><br /><br />
<a href="index.html" target="_self">Link 5</a><br /><br />
</div>
<div id="ban"></div>
<div id="name"></div>
<div id="contend">
<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt
ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo
dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor
sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor
invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et
justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem
ipsum dolor sit amet.</p>
<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt
ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo
dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor
sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor
invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et
justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem
ipsum dolor sit amet.</p>
<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt
ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo
dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor
sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor
invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et
justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem
ipsum dolor sit amet.</p>
</div>
<div id="foot"><center><span class="foottxt">© 2010 <a href="index.html" target="_self">PastellCrossTemp</a> Design by: <a href="http://www.sc-grafix.de.vu" target="_blank">Sc-Grafix</a></span></center></div>
</div>
</body>
</html>
Code:
/* === © 2010 PastellCrossTemp Design by: Sc-Grafix === */
body {
font-family: "Courier New", Courier, monospace;
font-style: normal;
font-variant: normal;
color: #FFFFFF;
font-size: 0.75em;
background-image: url(img/bg.jpg);
background-repeat: repeat-x;
background-color: #f7dbb3;
}
a:link {color: #f7dbb3; text-decoration:none}
a:visited {color: #f7dbb3; text-decoration:none}
a:active {color: #f7dbb3; text-decoration:none}
a:hover {color: #9c9f84; text-decoration:underline}
#wrapper {
width: 850px;
margin: 0 auto;
}
#head {
width: 550px;
height: 64px;
margin-left: 210px;
border: solid 5px;
border-color: #ffffff;
}
#nav {
width: 195px;
height: 249px;
margin-top: -5px;
padding-top: 5px;
padding-left: 10px;
float: left;
border: solid 5px;
border-color: #ffffff;
}
#ban {
width: 550px;
height: 254px;
margin-top: -5px;
margin-left: -5px;
float: left;
border: solid 5px;
border-color: #ffffff;
}
#name {
width: 75px;
height: 254px;
margin-top: -5px;
margin-left: -5px;
float: left;
border: solid 5px;
border-color: #ffffff;
}
#contend {
width: 530px;
margin-top: -5px;
margin-left: 210px;
padding-top: 5px;
padding-left: 10px;
padding-right: 10px;
padding-bottom: 5px;
clear: left;
border: solid 5px;
border-color: #ffffff;
}
#foot {
width: 550px;
margin-top: -5px;
margin-left: 210px;
margin-bottom: 50px;
clear: left;
background-color: #ffffff;
border: solid 5px;
border-color: #ffffff;
}
.foottxt {
color: #a97e5e;
}
/* === © 2010 PastellCrossTemp Design by: Sc-Grafix === */