[Erledigt] FF geht IE nicht? (border-top-style:outset;)

[bgx]

Hallo!

Habe folgenden Codeschnipsel:

Code: Alles auswählen

                <tr>
                    <td style="border-top-width:1px;height:16px;border-top-style:outset;" width="100%" colspan="2" bgcolor="#E5E5E5">
                        <p align="center"><span class="mainmenu">&nbsp;<span style="position:absolute;left:0px;z-index:3;"><a href="groupcp.php" class="mainmenu"><img src="templates/subSilver/images/icon_mini_groups.gif" width="12" height="13" border="0" alt="Benutzergruppen" hspace="3" />Benutzergruppen</a>&nbsp;<a href="map.php" class="mainmenu"><img src="templates/subSilver/images/icon_mini_map.gif" width="12" height="13" border="0" align="top" alt="Karte" hspace="3" />Karte</a>&nbsp;<a href="./atlas.php?mode=viewmap" class="mainmenu"><img src="templates/subSilver/images/icon_mini_atlas.gif" width="12" height="13" border="0" alt="geo Karte" hspace="3" />geo Karte</a>&nbsp;<a href="usercars_list.php" class="mainmenu"><img src="templates/subSilver/images/icon_mini_usercars.gif" width="12" height="13" border="0" hspace="3">Hunde der User</a>&nbsp;<a href="privmsg.php?folder=inbox" class="mainmenu"><img src="templates/subSilver/images/icon_mini_pm.gif" width="12" height="13" border="0" hspace="3" />Du hast keine neuen Nachrichten</a>&nbsp;<a href="javascript:void(0);" onClick="window.open('chat/chatbox.php','2_ChatBox','scrollbars=no,width=640,height=480,resizable=Yes')" class="mainmenu"><img src="templates/subSilver/images/icon_mini_login.gif" width="12" height="13" border="0" hspace="3" />Chat</a>&nbsp;<a href="album.php" class="mainmenu"><img src="templates/subSilver/images/icon_mini_album.gif" width="12" height="13" border="0" alt="Fotogalerie" hspace="3" />Fotogalerie</a>&nbsp;<a href="./calendar.php" class="mainmenu"><img src="templates/subSilver/images/icon_mini_calendar.gif" width="12" height="13" border="0" alt="Kalender" hspace="3" />Kalender</a>&nbsp;<a href="activity.php" class="mainmenu"><img src="templates/subSilver/images/icon_mini_activity.gif" width="12" height="13" border="0" alt="Spiele" hspace="3" />Spiele</a>&nbsp;<a href="smilies.php" class="mainmenu"><img src="templates/subSilver/images/icon_smilie_album.gif" width="12" height="13" border="0" alt="" hspace="3" />Smilie Album</a> &nbsp;<a href="lexicon.php" class="mainmenu"><img src="templates/subSilver/images/icon_mini_faq.gif" width="12" height="13" border="0" alt="Lexikon" hspace="3" />Lexikon</a></span></span></p>

                    </td>
                </tr>

Warum wird im FireFox die Linie üder dem Menü grau gemalt, beim IE lässt er sie aber weg?

[miccom]

Kann man sich das irgendwo auch fertig anschauen?

[easygo]

Code: Alles auswählen

                    <td style="border-top-width:1px;height:16px;border-top-style:outset;" width="100%" colspan="2" bgcolor="#E5E5E5">

Hm, was ich ja immer wieder lustig finde, sind so Mixe aus neumodernen Untereigenschaften
wie border-top-style (CSS2) und als "deprecated" eingestuften Attributen wie bgcolor



Dabei hätte das denselben Effekt -->

Code: Alles auswählen

style="border-top-width:1px;height:16px;border-top-style:outset;background-color:#E5E5E5;"

Denke aber, das ist falsch, wenns da nur ne graue Headline geben soll! Richtiger wäre

Code: Alles auswählen

style="border-top-width:1px;height:16px;border-top-style:outset;border-top-color:#E5E5E5;"

und btw, das versteht auch der IE / easy

[bgx]

Ich danke dir easygo!

Habs jetzt etwas anders gelöst, aber nun auch "neudeutsch" geschrieben.

Vieleicht kannst du mir noch mit dem Header Backgroundbild helfen, das bei kleineren Auflösungen hässlich überlappt (im IE sieht es noch schlimmer aus)

Code: Alles auswählen

				<td width="40%" style="background-image:url('templates/subSilver/images/backgrl.jpg'); background-repeat:no-repeat; background-attachment:fixed; background-position:100% 0%;"><a href="./"><img src="templates/subSilver/images/hundeforum.gif" border="0" alt="Hundeforum für Hundehalter im Saarland" vspace="0" /></a></td>
				<td align="center" width="50%" valign="middle" style="background-image:url('templates/subSilver/images/backgr.jpg'); background-repeat:no-repeat; background-attachment:fixed; background-position:100% 0%;"><h1>Hundeforum für Hundehalter im Saarland</h1><br /><span class="gen">Hundeforum für Hundehalter im und um das Saarland<br/>Hier findest du gleichgesinnte und andere Hundefreunde<br />&nbsp;<span style="z-index:1;position: absolute; right: 0; top: -7"><img src="rotator2.php" border="0"></span> </span> 

und zwar mit backgrl.jpg und backgr.jpg mach ich nen Farbverlauf im Hintergrund. Klappt auch so super, nur wie gesagt wenn ich das Fenster kleiner ziehe Überlappt das rechte dem Linken.

Zu sehen auch Life auf meinem Board.

[easygo]

Oben zweimal bearbeitet OK aber was hat sich geändert?
Ich mein, das Thema hat sich doch erledigt, oder nicht?

Also auf ein Neues..

und zwar mit backgrl.jpg und backgr.jpg mach ich nen Farbverlauf im Hintergrund. Klappt auch so super, nur wie gesagt wenn ich das Fenster kleiner ziehe Überlappt das rechte dem Linken.

Wozu dann in "jede" td Zelle schreiben? Würde 1x den table Tag dafür missbrauchen.
Zumal der Farbverlauf, den du wolltest, sowieso nur links funktioniert (IE7)
Auf der rechten Seite spielt das transparente GIF nicht mit :/

Btw: span Tags sollte man nicht verschachteln, mein ich. vspace="0" ? kann man auch weglassen.

[bgx]

@easygo: Danke erstmal, aber wie soll ich soetwas für verschiedene Auflösungen im "table-Tag" lösen? Will ja links und rechts in der Tabelle einen Verlauf.
Wenn ich jetzt ein Hintegrundbild nehme, geht das ja nie bei den versch. Auflösungen bis an den Rand? Ich müsste also so wie ich es auch habe zwei Bilder nehmen, eins für links und eins für rechts, wobei das rechte beim verkleinern des Fensters unter dem linken verschwinden müßte, dann wäre es i.O. Aber wie mach ich das? Hab schon mit z-index rumgespielt, hat aber nicht funktoniert!

[easygo]

Wenn ich jetzt ein Hintegrundbild nehme, geht das ja nie bei den versch. Auflösungen bis an den Rand?

Warum nicht? Hier mal ein Gegenbeispiel zum austesten..

Code: Alles auswählen

style="background-color:#FEFEFE; background-image:url('templates/subSilver/images/backgrl.jpg'); background-repeat:repeat-y;"

Vorteil: Pic kann um einiges schmaler sein. Soll heißen, Streifen würde reichen. easy

[bgx]

Hey dank Dir nochmal, hab mein Problem gelöst. Es lag an dem background-attachment:fixed; welches die komische Überlappung erzeugt hat. Nun sieht es gut aus und geht auch bei allen Auflösungen (außer 800x600).

Hmm optimiert Ihr überhaupt noch für so eine Auflösung oder kann man sowas vernachlässigen?