| Autor |
Nachricht |
käschdin
Threadersteller
Dabei seit: 09.02.2007
Ort: Berlin
Alter: 47
Geschlecht: 
|
Verfasst Mo 14.01.2008 14:22
Titel CSS und Firefox - Darstellungsproblem? |
  |
|
Hallo zusammen,
ich habe ein Problem mit der CSS-Navigation einer Website. Die Navi ist horizontal, besteht aus fünf grafischen Buttons (CSS-Listenfunktion) und hat links neben dem ersten und rechts neben dem letzten Navibutton eine Grafik (Efeu).
In IE6 und IE7 sieht alles sauber aus. Probleme macht mir nur Firefox (Version 2.0.0.11). Hier ist die Navi komplett ein paar Pixel nach unten verschoben. Macht an sich nix, aber die rechte Efeu-Grafik klebt oben am Bildschirmrand, während zwischen linker Efeu-Grafik und Rand ordnungsgemäß ein paar Pixel Freiraum sind.
Ich möchte nun entweder, dass die rechte Grafik auf Höhe der linken ist oder dass linke Grafik und Navi-Buttons nach oben rutschen, sodass sie auf Höhe der rechten Grafik sind.
Hier der Code aus der CSS-Datei:
| Code: |
.buttondiv {
position:absolute;
top: -170px;
left: -20px;
width: 968px;
height:50px;
}
.buttondiv li{
display: inline;
}
.buttondiv li a{
float: left;
color: black;
padding: 0px;
text-decoration: none;
}
.efeulinks {
position: relative;
background-image: url(../images/efeu_links.gif);
width: 70px;
height: 183px;
left: -25px;
top: 175px;
}
.efeurechts {
position: relative;
background-image: url(../images/efeu_rechts.gif);
width: 70px;
height: 183px;
left: 922px;
top: -10px;
}
|
Und der Code aus der HTML-Datei:
| Code: |
<ul class="buttondiv">
<div class="efeulinks"></div>
<li><a href="prinzip.html"><img src="images/prinzipmiliarii.jpg" alt="Prinzip Miliarii" / border="0"></a></li>
<li><a href="sinn.html"><img src="images/sinnertrag.jpg" alt="Sinn und Ertrag" / border="0"></a></li>
<li><a href="mitglied.html"><img src="images/mitgliedschaft.jpg" alt="Mitgliedschaft" / border="0"></a></li>
<li><a href="flotte.html"><img src="images/flotte.jpg" alt="Flotte" / border="0"></a></li>
<li><a href="betreiber.html"><img src="images/betreiber.jpg" alt="Betreiber" / border="0"></a></li>
</ul>
<div class="efeurechts"></div>
|
Wenn ich </ul> im HTML-Code ganz nach hinten setze, passt es zusätzlich bei IE7 nicht mehr.
Bin für jede Hilfe dankbar.
Viele Grüße,
Kerstin
|
|
| |
  |
 |
m
Moderator
Dabei seit: 18.11.2004
Ort: -
Alter: -
Geschlecht: 
|
Verfasst Mo 14.01.2008 14:31
Titel
|
|
|
| Code: | <ul class="buttondiv">
<div class="efeulinks"></div>
<li><a href="prinzip.html"><img src="images/prinzipmiliarii.jpg" alt="Prinzip Miliarii" / border="0"></a></li>
<li><a href="sinn.html"><img src="images/sinnertrag.jpg" alt="Sinn und Ertrag" / border="0"></a></li>
<li><a href="mitglied.html"><img src="images/mitgliedschaft.jpg" alt="Mitgliedschaft" / border="0"></a></li>
<li><a href="flotte.html"><img src="images/flotte.jpg" alt="Flotte" / border="0"></a></li>
<li><a href="betreiber.html"><img src="images/betreiber.jpg" alt="Betreiber" / border="0"></a></li>
</ul>
<div class="efeurechts"></div> |
Das hier darf so nicht sein. Eine ungeordnete Liste darf nur listen elemente enthalten.
| Code: | <div class="efeulinks"></div>
<ul class="buttondiv">
<li>...</li>
</ul>
<div class="efeurechts"></div> |
|
|
| |
 |
|
|
Anzeige
|
|
|
käschdin
Threadersteller
Dabei seit: 09.02.2007
Ort: Berlin
Alter: 47
Geschlecht:
|
Verfasst Mo 14.01.2008 14:36
Titel
|
|
|
|
Danke, hatte ich auch schon probiert und die Positionen in der CSS entsprechend angepasst. Mein Problem ist nur, dass die Efeu-Grafiken dann nicht mehr über den Buttons liegen (die sollen ein wenig überlappen).
|
|
| |
|
|
m
Moderator
Dabei seit: 18.11.2004
Ort: -
Alter: -
Geschlecht:
|
Verfasst Mo 14.01.2008 14:42
Titel
|
|
|
|
Google mal nach "z-index"
|
|
| |
|
|
käschdin
Threadersteller
Dabei seit: 09.02.2007
Ort: Berlin
Alter: 47
Geschlecht:
|
Verfasst Mo 14.01.2008 14:49
Titel
|
|
|
Danke ihr Schatzis. Jetzt passt es überall 
|
|
| |
|
|
| |
|
|
| Ähnliche Themen |
Darstellungsproblem im Firefox (!)
Darstellungsproblem Table IE/FireFox nach einfügen von Layer
Darstellungsproblem im IE7
FF/IE Darstellungsproblem
darstellungsproblem im ie 7
darstellungsproblem mit ff/ie
|
|
Willkommen auf dem Portal für Mediengestalter
