✔ Textabstand in FF anders als im IE

Status
Nicht offen für weitere Antworten.
P

Pase89

Grünschnabel
Hi Community,

da ich nun schon zwei Tage an diesem Programmcode rumexperimentiere und ich bisher noch keine Lösung gefunden habe, wende ich mich an euch.
Was ich eigentlich machen wollte ist eine Navigationsbar mit CSS die im IE und im FF laufen soll. Allerdings wird nur im Internet Explorer alles richtig angezeigt und in Mozilla nicht. Hier mal mein Code. Da ich neueinsteiger in CSS bin, kann es natürlich auch sein, dass da was falsch gelaufen ist. Danke euch schonmal im Vorraus :)

Gruß Pase

Code: 
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
<title>
</title>

<style type="text/css">

#navcontainer ul{

list-style-type: none;
text-align:right;
}

#navcontainer a {

line-height: 14px;
color:#BBA239;
font: 13px verdana;
font-weight:bold;
text-decoration:none;
display:block;
width:100px;
height:15px;
}

#navcontainer a:hover{

color:#f6e4c1;
background:transparent;
}



</style>

<body bgcolor="black">


<div style="position: absolute; width: 100px; height: 100px; z-index: 4; left: 1px; top: 0px" id="Ebene1">
	<img border="0" src="fantasy4.jpg" width="183" height="637"></div>

<div id="navcontainer" style="position: absolute; width: 100px; height: 100px; z-index: 5; left: 38px; top: 247px" >

  <ul>
    <li><a href="#" >News</a></li>
    <li><a href="#">Band</a></li>
    <li><a href="#">Gigs</a></li>
    <li><a href="#">Discographie</a></li>
    <li><a href="#">Merch</a></li>
    <li><a href="#">Guestbook</a></li>
    <li><a href="#">Contact</a></li>
    <li><a href="#">Impressum</a></li>
  </ul>



</body>
</html>
 

Anhänge

  • Anzeige im FF.jpg
    Anzeige im FF.jpg
    62,6 KB · Aufrufe: 45
  • Anzeige im IE.jpg
    Anzeige im IE.jpg
    67,9 KB · Aufrufe: 37
Bei solchen Problemen mache ich immer eine CSS Datei für den IE fertig, dar kannst du die margin-bottom für die li Element ändern z.B

Code: 
li
{
	margin-bottom:0px;
}

und in der normalen CSS Code musst du:

Code: 
li
{
	margin-bottom:4px;
}

Der Zugriff aus der CSS Datei kannst du so machen:

<!--[if IE]><link href="name.css" rel="stylesheet" type="text/css" /><![endif]-->

Dann greift nur der IE aus der CSS Datei kein anderer Browser.
 
Zuletzt bearbeitet:
Hi,

es ist empfehlenswert, beim Einsatz einer Liste, ihre Polsterungseigenschaften auf null zu setzen, da diese in den Browsern unterschiedlich ausfallen.

Code: 
<style type="text/css">
#navcontainer ul {
margin:0;
padding:0;
list-style-type: none;
text-align:right;
}

#navcontainer a {
line-height: 15px;
color:#BBA239;
font: 13px verdana;
font-weight:bold;
text-decoration:none;
display:block;
width:100px;
height:15px;
}

#navcontainer a:hover{
color:#f6e4c1;
background:transparent;
}
</style>
<!--[if lte IE 7]>
<style type="text/css">
#navcontainer li { float:left; } /* schliesst Lücke zwischen den Listenpunkten */
</style>
<![endif]-->
 
Ersteinmal danke für eure Antworten ich werde es gleich mal bei mir ausprobieren und mich danach wieder bei euch melden ob es funktioniert hat.
Es tut mir leid nochmal eine Frage stellen zu müssen, aber ich habe zusätzlich die Scrollleiste so formatiert, dass sie im IE schwarz angezeigt wird. Kann ich das auch mit einer zusätzlichen CSS Datei handhaben (speziell für FF bzw. IE wie Lösung oben), weil FF nimmt das ganze nicht. Wäre super, danach bin ich wunschlos glücklich. Danke euch für eure schnelle Hilfe.

Gruß Pase

CSS der Scrollleiste -> der Code wird ebenfalls eingebettet.

Code: 
BODY {scrollbar-face-color:black;
scrollbar-highlight-color: white;
scrollbar-shadow-color: white;
scrollbar-3dlight-color:gray;
scrollbar-arrow-color:gray;
scrollbar-track-color: gray;
scrollbar-darkshadow-color: gray);
overflow-x:hidden;
overflow-y: auto;   



}
 
Hi,

ausser dem IE, sowie Opera und Konqueror im Quirksmodus, unterstützt keiner der übrigen Browser die scrollbar-Eigenschaft aus dem Hause "Microsoft" zum Einfärben der Scrollbalken.
 
Hi Leute, also ich bin erst heute zum Testen gekommen und ich muss sagen es klappt!!
Danke euch nochmals für eure schnelle Hilfe, nur leider übernimmt der Firefox das Fettgedruckte nicht, was ich im IE angegeben hab.Kann mir da noch jemand helfen, ich hab es schon mit sämtlichen Befehlen meiner Kenntnis versucht, doch leider bleibt das ganze dünngedruckt. Danke euch, danach ist das Thema dann endlich abgeschlossen *lach*

Gruß Pase
 
Code: 
#navcontainer a {
line-height: 15px;
color:#BBA239;
font: 13px verdana;
font-weight:bold;
text-decoration:none;
display:block;
width:100px;
height:15px;
background:red;
}
wird bei mir von allen Browsern angenommen.
 
Status
Nicht offen für weitere Antworten.

Neue Beiträge

Zurück