CSS Ausgabe: Top Grenze Anzeigen nicht in IE

Question

Auf meiner Seite, ich bin die JavaScript Tabifier mit Tabs

In Firefox zu erstellen, die Laschen eine obere Grenze (wie gewünscht).

In IE 6/7 haben die Registerkarten keinen oberen Rand, obwohl ich für die entsprechende CSS-Eigenschaft definiert habe (ul.tabbernav li a).

Irgendwelche CSS Ideen, warum Firefox die obere Grenze aber IE nicht hat?

UPDATE

Per unten Kommentar, die Seite jetzt w3c validates aber ich bin immer noch erlebt die CSS Problem, wie ursprünglich beschrieben.

upate 2

Ja, ich bin mir dessen bewusst IE 6/7/8 nicht border-radius unterstützen, aber ich habe diese Eigenschaft entfernt und definiert ausdrücklich border-top und die border-top ist die Anzeige noch nicht für IE 6/7.

Answer 1

Entweder fügen margin-top:1px; zu ul.tabbernav oder padding-top:1px; zu div.listingTabs

Ich weiß, das ist ein IE-Fehler aber Firebug in FF kann noch helfen. Wenn Sie Ihr ul oder das div überprüfen, sehen Sie, dass die UL außerhalb des Anzeigebereichs des Elternteils liegt.

Answer 2

Es sieht so aus, als ob Sie gebogene Ränder verwenden. IE 6 und 7 unterstützen keine gekrümmten Grenzen. Ich denke, IE 8 tut es.

Erstellen Sie ein IE-spezifisches Stylesheet und ändern Sie die Art und Weise, wie Sie die Rahmen hier erstellen.

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

Sie können entweder reguläre Grenzen angezeigt werden oder die Grenzen entfernen und ein Hintergrundbild erstellen, um es dort aussieht wie Grenzen gekrümmt sind.

Answer 3

Ich habe keinen IE, mit dem ich im Moment testen kann; aber gibt es eine chance der grenzen außerhalb der höhe des enthaltenen div (.tabbernav) und versteckt mit einer overflow Regel woanders?

Auf der anderen Seite möchten Sie möglicherweise versuchen, overflow: visible in die .tabbernave Klasse hinzuzufügen. Das oder erhöht seine Höhe und reduziert die Höhe der .tabbernave li s.

Answer 4

Versuchen Sie, die Zeilenhöhe für diese einzustellen. Ich hatte ein extrem ähnliches Problem in ie7 einmal, außer dass es nicht die oberen und unteren Grenzen zeigte. Sie wurden tatsächlich abgeschnitten.

Nicht sicher über die genaue Höhe, die für Sie hier arbeiten würde, aber versuchen Sie es.

Answer 5

Alle angebotenen Lösungen nicht für mich in IE7 Arbeit tat, aber das tat :-)

Seperate die Unter Arten wie folgt:

border-left-style: solid; 
border-left-width: 1px; 
border-left-color: red; 

I used the solution from this source