nicht angemeldet
sorry, ich denke das Thema ist schon tausendmal behandelt worden, aber ich finde einfach nichts wo ich weiterkomme. Ich möchte gern eine einheitliche Darstellung im IE und FF erzielen. Komischerweise (sonst ist andersrum) passt es diesmal im IE und im FF nicht. Hier mal der HTML Code
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type"
content="text/html; charset=iso-8859-1">
<meta name="robots" content="INDEX,FOLLOW">
<meta name="keywords"
content="homepage,dokument,webpage,page,web,netz,homepage dokument webpage page web netz">
<meta name="description"
content="homepage, dokument, webpage, page, web, netz" >
<title>mmulive.design</title>
<link rel="stylesheet" href="menue.css" type="text/css">
<link rel="stylesheet" href="format.css" type="text/css">
</head>
<body >
<div id="wrap">
<div id="navigation">
<img class="logo" src="images/logo.gif" width="172" height="30" alt="logo">
<br/>
<br/>
<ul class="menu1">
<li ><a href="index.html" >home</a></li>
<li><a href="do.html" >what we do</a></li>
<li class="aktuell"><a href="who.html" >who we are</a></li>
<li><a href="where.html" >references</a></li>
<li><a href="offer.html" >what we offer</a></li>
<li><a href="press.html" >press</a></li>
<li><a href="career.html" >career</a></li>
<li><a href="world.html" >around the world</a></li>
</ul>
</div>
<div id="inhalt">
<div id="text">
<h2> <img src="images/picspace.gif" alt="photo bernhard" width="150" height="225" hspace="5" align="left" />Lorem ipsom – solor sit</h2>
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. <br></br>
<a href="mailto:xxx@xxx.com">contact</a>
<br/>
</div>
</div>
</div>
<!-- ende inhalt-->
</body>
</html>
dazu habe ich folgende zwei css dateien, die erste für den allgemeinen inhalt:
* {
margin: 0;
padding: 0;
}
body
{
background-color: #6f7582;
font-size: 13px;line-height: 19px;
font-family: arial, helvetica, tahoma ,verdana, sans-serif;
color:#868686;
text-align:left;
}
li {font-size: 15px;line-height: 19px;
font-family: arial, helvetica, tahoma ,verdana, sans-serif;
text-align:left;color:#7F7F7F;
}
h2{letter-spacing:2px;
font-family: "Trebuchet MS",arial, helvetica, verdana, tahoma, sans-serif;font-size: 15px;color:#0066B3;
}
#wrap
{
width: 1090px;
margin-top: 20px;
margin-left: auto;
margin-right: auto;
margin-bottom: auto;
height: 622px;
background-color:#000000;
}
#navigation
{width: 200px;
float: left;
padding-left: 10px;
padding-top: 10px;
height: 612px;
border-right: 1px solid #6f7582;
background-color: #000000;
}
/* bleibt immer gleich bis auf hintergrundbild */
#inhalt
{width: 879px;
float: right;
height: 622px;
position:relative; top:0px; left:0px;
z-index: 1;
background-image: url(images/bgplain.jpg);
background-repeat: no-repeat;
}
#text {
float: top;
padding-top: 74px;
padding-left:30px;
padding-right: 0px;
width:75%;
height:520px;
z-index: 2;
overflow: auto;
scrollbar-arrow-color: #fff;
scrollbar-base-color: #2d2d2d;
scrollbar-highlight-color : #111111;
scrollbar-shadow-color : #2d2d2d;
SCROLLBAR-TRACK-COLOR: #3F3F3F;
#textwho {
position:absolute;
top:74px;
left:200px;
padding-right: 0px;
width:400px;
height:550px;
z-index: 2;
overflow: auto;
scrollbar-arrow-color: #fff;
scrollbar-base-color: #2d2d2d;
scrollbar-highlight-color : #111111;
scrollbar-shadow-color : #2d2d2d;
SCROLLBAR-TRACK-COLOR: #3F3F3F;}
#leiste {
background-color:#000000;
height:30px;
margin-right: 23px;
padding-bottom: 5px;
}
.logo {padding-top: 5px;
padding-left: 15px; }
h2{letter-spacing:2px;
font-family: "Trebuchet MS",arial, helvetica, verdana, tahoma, sans-serif;font-size: 16px;color:#0066B3;
}
/* scrolleiste internet explorer ab vers.5.5 */
body
{scrollbar-arrow-color: #fff; scrollbar-base-color: #2d2d2d;
scrollbar-highlight-color : #000000; scrollbar-shadow-color : #2d2d2d;
SCROLLBAR-TRACK-COLOR: #3F3F3F;}
#unterstrichen li a:link , #unterstrichen li a:visited , #unterstrichen li a:active
{display:block;
color:#A7A7A7; text-decoration:none;
font-size: 13px;
margin:0px;padding-right:23px;
height: 50px;
width: 200px;
line-height: 50px;
font-family:"Trebuchet MS",verdana,arial, times, serif;
}
#unterstrichen li a:hover {
color:#fff;
text-decoration: none;}
und die zweite für das menü:
.menu1 {text-align:right;
}
.menu1 ul, .menu1 li {
list-style-type: none;
text-align:right;
}
.menu1 li a:link , .menu1 li a:visited , .menu1 li a:active{display:block;
color:#A7A7A7;text-decoration:none;
font-size: 14px;
height: 40px;
width: 150px;
overflow: hidden;
line-height: 40px;
font-family:"Trebuchet MS",verdana,arial, times, serif;
background-image:url(images/nav.gif);
background-repeat:no-repeat;
text-align:right;
background-position:80%
}
.menu1 li a:hover {
color:#fff;
text-decoration:none;
background-image:url(images/nav2.gif);
padding-right:0px;
left: 0px;
}
.menu1 .aktuell a:link, .menu1 .aktuell a:visited, .menu1 .aktuell a:active{
display:block;
color:#0066B3;text-decoration:none;
font-size: 14px;
margin:0px;padding-right:70px;
height: 40px;
line-height: 40px;
font-family:"Trebuchet MS",verdana,arial, times, serif;
background-image:url(images/nav_aktuell.gif);
background-repeat:no-repeat;
text-align:right;
border:solid 0px white;
background-position:80%;
width: 130px;
}
/* allgemeine links im text */
a:link, a:visited, a:active{ font-size: 13px;line-height: 19px;
font-family: arial, helvetica, tahoma ,verdana, sans-serif; color:#0066B3;
text-decoration: none;}
a:hover{
color:#a3a3a3;}
Am besten sieht man was ich meine bei "who" z.B. die Naviagation ist unterschiedlich was die Seitenabstände angeht und auch der Abstand zwischen Bild und Schrift ist unterschiedlich. Im IE ist ein bissl mehr Luft, was mit besser gefällt!
Vielen Dank für Eure TIPS!