[css] Krijg lijnen van mijn tabs niet goed

[shades]

Ik probeer een tabinterfaceje te maken maar ik krijg de lijnoverlappingen van de tabs niet weg (zie plaatjes) Heb zitten proberen met z-index etc. maar mocht niet baten.

De source staat hier

Iemand een idee wat er mis is ?

[CrashOne]

Haal van je tabs de onderste border eens weg.

[Thijsmans]

Vervang de class .Tab door deze:

Cascading Stylesheet:

.Tab
{
    border-left:1px solid white;
    border-top:1px solid white;
    border-right:1px solid gray;
    padding:2px 6px 4px 20px;
    margin-bottom:0px;
    margin-right:0px;
}

hth

<sub>die border-bottom is dus weg

/edit: /me wordt een dagje ouder</sub>

[ Voor 12% gewijzigd door Thijsmans op 13-09-2004 11:39 ]

[Verwijderd]

Haal de padding-bottom van je .Tab en .TabSelected weg. Verander je padding-bottom van de #TabControl. Helaas is een CSS hack nodig om hem in zowel IE als Gecko het goed te weergeven:

code:

#TabControl {
  margin:           20px 20px 0px 20px;
  padding-bottom:   4px;
  padding-left:     10px;
  border-bottom:    1px solid white;
}
* html #TabControl {
  padding-bottom:   3px;
}

/me is weer eens spuit 11

Resultaat

[ Voor 23% gewijzigd door Verwijderd op 13-09-2004 11:48 ]

[shades]

Ik maar denken, als ik nu die onderste in de kleur maar van de highlight (wit hier) dan komt het goed. De links en rechts border wordt dan verlengt naar de border-bottom. Duidelijk. Gedrag dat je niet verwacht. Thx

[CrashOne]

* CrashOne CrashOne is eens een keer geen spuit 11

[ Voor 14% gewijzigd door CrashOne op 13-09-2004 11:47 ]

[Verwijderd]

CrashOne schreef op 13 september 2004 @ 11:46:
/me CrashOne is eens een keer geen spuit 11

Maar wel onvolledig

[Thijsmans]

Verwijderd schreef op 13 september 2004 @ 11:47:
[...]


Maar wel onvolledig

Die van jou klopt niet Die witte rand boven de 'echte' content hoort niet

_{Bovendien spam je voor NextAvenue}

[Verwijderd]

Prammenhanger schreef op 13 september 2004 @ 11:51:
[...]


Die van jou klopt niet Die witte rand boven de 'echte' content hoort niet

_{Bovendien spam je voor NextAvenue}

Lol, dat oog voor detail is mij volledig ontschoten de afgelopen jaren, daar hebben we de designer voor... Even een quickfix verzinnen :x

offtopic:
Ik spam niet voor nextavenue... Dat HTML bestand is gewoon een bestand op mijn server , als ik naar hotscripts verwijs, spam ik toch niet opeens voor Hagen Hosting - Free setup?
Hmm, 't schijnt wel te helpen, al drie mensen via dat resultaat voorbeeld op de website weten te halen

// Edit, okey, die border-bottom van de .TabSelected moest je dus niet weghalen , heb het aangepast

[ Voor 43% gewijzigd door Verwijderd op 13-09-2004 11:59 ]

[shades]

Verwijderd schreef op 13 september 2004 @ 11:40:
Haal de padding-bottom van je .Tab en .TabSelected weg. Verander je padding-bottom van de #TabControl. Helaas is een CSS hack nodig om hem in zowel IE als Gecko het goed te weergeven:

code:

#TabControl {
  margin:           20px 20px 0px 20px;
  padding-bottom:   4px;
  padding-left:     10px;
  border-bottom:    1px solid white;
}
* html #TabControl {
  padding-bottom:   3px;
}

* shades is weer eens spuit 11

Resultaat

De witte lijn loopt nu ook onder de geselecteerde tab. Dat kan niet de bedoeling zijn. Het weghalen van de border-bottom was voldoende. Ik gebruik ie6 en daar werkt het nu. Dat andere mensen andere browsers hebben, ongenuanceerd: niet mijn probleem.

[Verwijderd]

Doe dan even mijn oplossing, dan doet hij het ook in Gecko...
egoïst

// Check even mijn enalaatste reply, het probleem is nu opgelost...

[ Voor 34% gewijzigd door Verwijderd op 13-09-2004 11:58 ]

[CrashOne]

http://tamaela.nl/got/tabs.htm

Werkt toch mooi? Zie je tenminste het verschil tussen de active tab en de rest.

[shades]

Ja, dit werkt ook.
Nu maar eens even zien of we e.e.a via jscript dynamisch kunnen maken

[JayVee]

Goed artikel op A List Apart: Sliding Doors of CSS

[shades]

JayVee schreef op 13 september 2004 @ 13:32:
Goed artikel op A List Apart: Sliding Doors of CSS

Ga ik lezen.

Heb trouwens geupdate. Is nu "dynamisch" met ?tab=0 enzo

update:
Heb artikeltje gelezen. Is interessant. niet zozeer omdat ik mijn tabje moet verfraaien want ik vind ze best zo (is slechts voor een back-end) maar mocht ik iets willen maken wat moet smoelen dan weet ik het te vinden.

[ Voor 30% gewijzigd door shades op 13-09-2004 20:43 ]