• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

FF vs. IE.... mal wieder

thuemmy

Aktives Mitglied
Hallo, wie könnte es wieder anders sein, es geht um Darstellungsunterschiede, zwischen IE (5.01 bis 7.0) und dem FF.

Hier mal das Bild dazu:
6_0.png


Es betrifft sowohl oben die Navigation, als auch unten den Fuß.
IE 5.01- nur der Fuß
IE 5.5 - nur der Fuß
IE 6.0 - Fuß und Navi
IE 7.0 - nur die Navi

Richtig wäre es, wenn die Navigation (obere Zeile) alles rechts an das Logo anschließen würde, und der Fuß sollte natürlich in der Mitte sein. Ich vermute mal, dass es wieder irgendeines Hacks bedarf, den ich aber bis jetzt noch nicht im I-Net gefunden habe :-(

Link zur Seite: DEWA-Schaltechnik GmbH - Ihr Spezialist für Schaltechnik

Vielen Dank schonmal für Eure Hilfe und
Gruß thuemmy

Edit: Das erste Problem (Navigation) habe ich vielleicht gefunden, wird gerade mit browsershots.org überprüft.
 
Zuletzt bearbeitet:
Auf den IE 5 nehme ich persönlich keine Rücksicht mehr.

Ungeprüft könnten die Fehler für den IE 6 hier auftreten:

Code:
.bilder_navi
{
margin-left:10px;
margin-right:10px;
display:block;
float:left;
}

.bilder_navi_filler
{
margin-left:10px;
margin-right:10px;
display:block;
float:left;
width:30px;
}

.bilder4
{
display:block;
margin-left:50px;
margin-top:10px;
margin-bottom:20px;
float:left;
}

Ersetze über all das "display: block;" durch
Code:
display: inline;
Siehe IE-Doubled-Float-Margin-Bug
 
Diese 3 Selektioren, die Du da genannt hast, sind für eine komplett andere Geschichte zuständig, werde das aber nochmal prüfen.

In der oberen Navizeile habe ich das geschafft. ich habe dem <ul>-Tag über CSS einfach die entsprechende Weite mitgeteilt.

Der Fuss ist noch nicht in Ordnung, weiß auch nicht, woran das liegen könnte :-( Und was mir jetzt noch aufgefallen ist, in der unteren Navi-Zeile, das eingekringelte Bildchen, ist runtergerutscht.

ie60.png


Kein Ahnung, woran das wieder liegt.

Gruß thuemmy

Edit: Das eingekringelte ist nur noch im IE 6.0 so. das mit dem Fuß in 5.x und in 6.0
 
Zuletzt bearbeitet:
Das mit der Navi ist erstmal (schlampig) gefixed. Aber der Fuß bereitet mit noch Kopfzerbrechen. Vielleicht hat ja noch jemand eine Lösung.

Gruß thuemmy
 
Footer
Eigentlich sollten Elemente mit position: absolute; ohne Angaben für top und bottom dort angezeigt werden wo sie auch mit position:static; stehen würden.
Im IE5-7 funktioniert das leider nicht so gut.
Gebe #footer auch einen Wert für left:
Code:
#footer {
background:#BBBBBB none repeat scroll 0%;
bottom:0;
[COLOR="DarkRed"][B]left:0;[/B][/COLOR]
line-height:1.5em;
position:absolute;
width:100%;
}
Navigation
Ich habe einfach h1 und #menue_oben in einem div zusammengeschlossen.
Code:
[B][COLOR="DarkRed"]<div>[/COLOR][/B]
         <h1>DeWa-Schaltechnik GmbH
         <span>&nbsp;</span></h1>
         <ul id="menue_oben">
            <li class="sprache-li"><a href="#" class="sprache-link sprache">ENGLISH</a></li>
            <li class="wir-li"><a href="wir_ueber_uns.php" class="wir-link wir ">WIR &Uuml;BER UNS</a></li>
            <li class="produkte-li"><a href="index.php" class="produkte-link produkte active_o">PRODUKTE</a></li>
            <li><a href="referenzen.php" class="referenzen-link referenzen ">REFERENZEN</a></li>
         </ul>
		    <span class="fueller_links">&nbsp;</span>
[B][COLOR="DarkRed"]</div>[/COLOR][/B]
Das hat für meine Standard-Schriftgröße (IE5-6) gereicht.
Dein Konstrukt ist aber extrem Schriftgrößenabhängig.
Gerade die älteren IE reagieren überdimensional wegen der fehlenden font-size in % für body.

Ideal finde ich die Navigation nicht.
 
Zuletzt bearbeitet:
Hallo neuroleptika,

vielen Dank für die Hilfe. Das mit der oberen Navileiste hatte ich schon gelöst gehabt, indem ich der ul width: (Länge der li-Elemente); mitgegeben habe. Mit dem Footer klappt das nun auch. Bei der unteren Navileiste habe ich nach dem Motto "quick and dirty" ein bisschen getrickst. Muss ich mich morgen nochmal dranbegeben.

Dass alles nicht so ideal ist, kann ich mir vorstellen... aber ich arbeite dran, besser zu werden.

Gruß thuemmy
 
Ich habe body font-size:100% gegeben.
Den a-Elementen overflow: hidden; (Expanding Box Bug IE5-6).
In anderen Browsern wird damit das "Überlaufen" bei größerer Schrift verhindert. Überstehendes wird damit aber abgeschnitten.

noindex

Entweder solltest du für die Links auch die Image Replacement-Methode
wie für h1 anwenden
oder auf height und width verzichten.
 
Hallo neuroleptika,

vielen Dank für Deine Mühe. Der Ansatz für die Image Replacement-Methode für die Links, das ist tatsächlich eine gute Idee. Das werde ich dann wohl noch machen, aber heute nicht mehr. Wenigstens ist es erstmal durch Deine Tipps etwas besser geworden.

Gruß thuemmy
 
Zurück
Oben