[IE/FF] IE renderd border-top niet? - Softwareontwikkeling

maandag 6 februari 2006 15:11

Acties:

Tring Tring!

Topicstarter

Ik probeer wat simpele tabjes te maken, (ja dat kan ook via UL en LI), maar dit is ff een simpel testje.

Ik begrijp niet waarom IE, in dit geval de bovenkant van de tabs niet goed renderd.

HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "DTD/xhtml1-transitional.dtd">

<html>
<head>
    <title>test1</title>
<style>
    body {
    margin: 0px;
    font-family: Tahoma, Arial, Verdana, Sans-serif;
    font-size: 12px;
    text-align: left;
    }
    #frame {
    width: 400px;
    margin-right: auto;
    margin-left: auto;
    margin-top: 10px;
    }   
    div.tabArea {
    font-weight: bold;
    margin-bottom: 10px;
    border-bottom: 1px solid #000;
    vetical-align:bottom;
    }

    a.tab  {
    background-color: #003399;
    border: 1px solid #000000;
    border-bottom-width: 0px;
    padding: 2px 1em 0px 1em;
    text-decoration: none;
    }
    a.tab.special{
    float: right;
    margin-top: -3px;
    }
    
    a.tab, a.tab:visited {
    color: #fff;
    }
    
    a.tab:hover {
    color: #000;
    background-color: #ff0000;
    text-decoration: none;
    }
    
    a.tab.activeTab, a.tab.activeTab:hover, a.tab.activeTab:visited {
    color: #000;
    background-color: #ff0000
    }    
</style>
</head>

<body>
<div id="frame">
    <div class="tabArea">
    <a class="tab special" href="">special link 1</a>
    <a class="tab activeTab" href="">Home</a>
    <a class="tab" href="">Link 1</a>
    <a class="tab" href="">Link 2</a>
    <a class="tab" href="">Link 3</a>
    </div>
</div>
</body>
</html>

In FF werkt bovenstaande code zoals ik wil, in IE ben ik echter de bovenkant van de tabs kwijt.

FIREFOX

IE

Iemand die mij hier helderheid in kan verschaffen?

Verstand van Voip? Ik heb een leuke baan voor je!

maandag 6 februari 2006 15:21

Acties:

André

Analytics dude

Heeft misschien te maken met een te kleine line-height?

maandag 6 februari 2006 15:26

Acties:

Verwijderd

of misschien dat er gewoon iets overheen ligt? te kleine lineheight zou in principe gewoon moeten overflowen volgens mij, hoewel ik daar met ie niet zeker van ben

maandag 6 februari 2006 15:34

Acties:

megamuch

Tring Tring!

Topicstarter

hmm.. zodra er content voor de tabs komt dan wordt het wel netjes gerenderd. Dus met een

code:

&nbsp;

ervoor werkt het wel...

* megamuch gaat nog ff testen..

[ Voor 9% gewijzigd door megamuch op 06-02-2006 16:07 ]

Verstand van Voip? Ik heb een leuke baan voor je!