Darstellungsproblem - Opera & firefox linux

[Ador]

Hallo,
Ich habe ein Problem mit der Darstellung einer Seite unter Opera und unter Firefox im Linux.
Es liegt wohl am CSS, und zwar besteht unter den beiden genannten Browsern eine leichte Verschiebung eines Bildes. Passe ich den margin-top werd so an, dass das Bild unter oben genannten Browsern passt, dann ist es dann aber verschoben unter den Windows Firefox und IE usw. Es sieht so aus, als ob der angegebene Wert einfach etwas anders Interpretiert wird, warum und was kann man da machen?

mfg
ador

 

[Maik]

Hi,

der dazugehörige HTML- und CSS-Code, oder der Link zur Seite wäre ganz hilfreich, um sich dazu überhaupt äußern zu können.

mfg Maik

 

[Ador]

#navi ul {
margin-top:133px; /setzt die 4 Menüpunkte an die richtige Stelle
margin-left:23px;
}

#navi li {
list-style-type:none;
padding-bottom:16px; /gibt den zum design passenden nötigen Abstand, der 4 Menüpunkte.
}

Und das bezieht sich eben nur auf einen div, indem ist die ul und li.

mfg

 

[Maik]

Hi,

mit diesem Code-Schnipsel lässt sich nun wirklich nicht viel anfangen, besser wäre, wie von mir schon erbeten, der vollständige HTML- und CSS-Code, und optimal der Link zur Seite.

mfg Maik

 

[Ador]

ok hier der link der seite:
http://www.thiel-malerbetrieb.ador-design.de/

* {margin:0; padding:0;}
a:link { color: #0000FF;}
a:visited { color: #7C1496;}

#wrapper {
width:968px;
margin-left:auto;
margin-right:auto;
}


/* navi bereich*/
#navi {
background-image:url(bilder/3.gif);
width:162px;
height:401px;
float:left;
font-family:Verdana;
}
#navi ul {
margin-top:133px;
margin-left:23px;
}

#navi li {
list-style-type:none;
padding-bottom:16px;
}
#navi a {
color: black;
text-decoration:none;
font-size:12px;
font-weight:bolder;
}
#navi a:hover,
#navi a:focus {
color:white;
}

#navi a:active {
color:black;
}

/* content bereich*/
#content {
background-image:url(bilder/4.gif);
width:806px;
height:401px;
float:right;
font:Verdana, Arial, Helvetica, sans-serif;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:12px;
}
#content p {
margin: 25px;
margin-top:10px;
margin-right:50px;
}


#links {
margin-left:25px;
float:left;
width:370px;

}
#rechts {
margin-right:45px;
float:right;
width:340px;
}
#content li {
margin-left:15px;
list-style:square;
margin-top:10px;
}
#content ul {
margin-top:15px;
margin-left:25px;
}
#content img {
float:right;
margin-right:50px;
margin-top:18px;
padding-left:15px;
padding-bottom:10px;
}

/* footer*/
#footer {
background-image:url(bilder/5.gif);
width:968px;
height:30px;
clear:both;
}
#footer ul {
padding-top:5px;
}

#footer p {
display:inline;
margin-left:25px;
color:#FFFFFF;
}
#footer a {
color:#FFFFFF;
}
#footer a:hover,
#footer a:focus {
color:#FF0000;
}
#footer .impressum {
margin-left:595px;
}


/* berschirften usw...*/
h2 {
font-size:16px;
margin-bottom:15px;

}

h1 {
margin:25px;
margin-top:15px;
margin-bottom:15px;
font-size:16px;
font-weight:bolder;
}

h2 {
font-size:12px;
font-weight:bolder;
}


mfg

 

[Maik]

Vielleicht solltest du einfach das Hintergrundbild für #navi in vier Teile schneiden, und diese direkt in den Menüpunkten einsetzen.

mfg Maik