HeadmasterX
Neues Mitglied
Mein problem ist das ich bei meiner seite eine jorizontale list erstellt habe und diese in unterschiedlichen browsern unterschiedlich aussieht... ich weiß die beschreibung ist nicht grad der hammerdeswegen hab ich euch hier mal den code der seite und den code von meinem stylesheet...
und hier css
Es handelt sich bei der verschiebung, die vertikal ist, um ein bereich von 1-3 pixeln... ich habe zuerst die schrift vereinheitlicht und jeden magin oder padding rausgenommen und border ist auch weg. ich weiß einfach nicht was ich vergessen habe zu definieren! Irgendetwas wir von dem browsereigenen stylesheet beeinflusst und ich weiß nicht was :-|
EDIT: ich habe den <li> Funfacts rausgenommen und den margin von #list um 30px erhöht und den margin von #list li rechts und links um 30px verkleinert (margin:0px 10px 0px;)
HTML:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html>
<head>
<title>Rainbow</title>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
<link rel="stylesheet" type="text/css" href="rainbow.css" />
</head>
<body>
<div id="head">
<p id="space">hallo</p>
<ul id="list">
<li id="active"><a href="rainbow.html">Home</a></li>
<li><a href="inhalt.html">Inhalt</a></li>
<li><a href="rainbow.html">Multimedia</a></li>
<li><a href="rainbow.html">Kontakt</a></li>
</ul>
</div>
<div id="left">
<h2>Left</h2>
</div>
<div id="right">
<h2>Right</h2>
</div>
<div id="body">
<h2>Body</h2>
</div>
<div id="bottom">
<h2>Bottom</h2>
</div>
</body>und hier css
Code:
* {
margin:0px;
padding:0px;
border:0px solid;
font: normal normal normal 16pt "Arial" "Times New Roman";
}
#head {
float:top;
background-color:red;
height:50px;
}
#body {
background-color:orange;
height:150px;
border-top:5px solid black;
}
#left {
float:left;
background-color:yellow;
width:250px;
height:150px;
border-top:5px solid black;
}
#right {
float:right;
background-color:green;
width:250px;
height:150px;
border-top:5px solid black;
}
#bottom {
clear:both;
background-color:blue;
}
#space {
margin:0px 0px 2px;
color:red;
}
#list {
margin-left:240px;
background-color:blue;
}
#list li {
display:inline;
padding:10px 10px 0px;
margin:0px 10px 0px;
background-color:orange;
border:0px solid;
border:5px solid;
}
#list #active {
border-bottom:5px solid orange;
}
#list li a {
font-size:16pt;
font-weight:bold;
text-decoration:none;
color:green;
letter-spacing:5px;
}Es handelt sich bei der verschiebung, die vertikal ist, um ein bereich von 1-3 pixeln... ich habe zuerst die schrift vereinheitlicht und jeden magin oder padding rausgenommen und border ist auch weg. ich weiß einfach nicht was ich vergessen habe zu definieren! Irgendetwas wir von dem browsereigenen stylesheet beeinflusst und ich weiß nicht was :-|
EDIT: ich habe den <li> Funfacts rausgenommen und den margin von #list um 30px erhöht und den margin von #list li rechts und links um 30px verkleinert (margin:0px 10px 0px;)
Zuletzt bearbeitet:
