fellfresse
Neues Mitglied
hallo,
ich habe ein problem mit einer horizontalen navi.
hier erstmal code:
so nun zu problem:
ich möchte ein layout wie karteireiter realisieren.
die aktiven links bekommen die gleiche hintergrundfarbe wie der rest der seite und gehören dann wie eine karteikarte zusammen.
alle anderen links sind durch einen weißen strich nach unten getrennt.
da ich nur 4 links habe, die links aber bei mehr als 20% seitenbreite sch... aussehen, hab ich einen weiteren (leeren) link eingefügt.
somit ergibt sich wie oben zu sehen eine breite für jeden link von 20%.
aber dann wird die leiste im IE zweispaltig angezeigt...
wenn ich aber allen links 19% angebe, dann fehlt wieder ein teil bis zum rand der keinen weißen strich (bottom) hat.
hab auch schon der navi mit border-bottom einen kompletten strich verpasst, aber denn kann ich den aktiven link nicht mehr wie zusammengehörig mit dem rest der seite darstellen.
wie kann ich das ändern?
ich habe ein problem mit einer horizontalen navi.
hier erstmal code:
Code:
html:
<div id= "navigation">
<ul>
[*][url=""]Home[/url]
[*][url=""]Über Uns[/url]
[*][url=""]Leistungen[/url]
[*][url=""]Kontakt[/url]
[*]<a class= "nav-space"></a>
[/list]
</div>
css:
#navigation
{
float: left;
width: 100%;
padding: 0 0 0 0;
font-size: 1em;
background-color: #870303;
}
#navigation li
{
float: left;
width: 19%;
font-size: 1em;
text-align: center;
list-style: none;
}
#navigation li a
{
padding: 0.3em;
display: block;
text-decoration: none;
font-weight: bold;
}
#navigation li a:hover , navigation li a:active
{
color: white;
}
a.nav-home
{
color: #870303;
background-color: #f2cc95;
border-top: 2px solid white;
border-right: 1px solid white;
}
a.nav
{
color: #f2cc95;
background-color: #870303;
border-bottom: 2px solid white;
border-right: 1px solid white;
border-left: 1px solid white;
}
a.nav-space
{
background-color: #870303;
border-bottom: 2px solid white;
border-left: 1px solid white;
border-right: none;
}
so nun zu problem:
ich möchte ein layout wie karteireiter realisieren.
die aktiven links bekommen die gleiche hintergrundfarbe wie der rest der seite und gehören dann wie eine karteikarte zusammen.
alle anderen links sind durch einen weißen strich nach unten getrennt.
da ich nur 4 links habe, die links aber bei mehr als 20% seitenbreite sch... aussehen, hab ich einen weiteren (leeren) link eingefügt.
somit ergibt sich wie oben zu sehen eine breite für jeden link von 20%.
aber dann wird die leiste im IE zweispaltig angezeigt...
wenn ich aber allen links 19% angebe, dann fehlt wieder ein teil bis zum rand der keinen weißen strich (bottom) hat.
hab auch schon der navi mit border-bottom einen kompletten strich verpasst, aber denn kann ich den aktiven link nicht mehr wie zusammengehörig mit dem rest der seite darstellen.
wie kann ich das ändern?