li image bei Primary links
Eingetragen von Transmitter (213)am 05.10.2009 - 11:19 Uhr in
Hi,
ich hätte gerne bei den primary-links ein image vor den Listeneinträgen.
Es will aber einfach nicht klappen, habe es schon so probiert:
#primarylinks
{
width:380px;
height:30px;
float:left;
margin:0px 0px 30px 0px;
padding:0px 0px 0px 0px;
}
#primarylinks ul
{
margin:10px 0px 0px 0px;
padding:0px 0px 0px 0px;
list-style-image:url(img/pfeil-icon.gif);
list-style:outside;
list-style-type:square;
height:50px;
}
#primarylinks ul li
{
float : left;
margin : 5px 10px 5px 0px;
padding : 0px 5px 0px 0px;
list-style : outside;
list-style-image:url(img/pfeil-icon.gif);
list-style-type:square;
display : block;
}aber auch so:
ul.primary-links
{
list-style-image:url(img/pfeil-icon.gif);
}und so:
.primary-links li.menu-176
{
list-style-image:url(img/pfeil-icon.gif);
list-style-type:square;
color : #FFFFFF;
border: 1px solid #333333;
margin : 5px 10px 5px 0px;
padding : 0px 5px 0px 0px;
list-style-position:inside;
display:block;
height:30px;
width:50px;
}Auf alle Eigenschaften reagieren die Links.
Bold, border, margin, etc.
Nur eben auf list-style-image nicht.
Habe es auch schon mit der direkten URL probiert (http: ...)
Und im Firebug wird der Pfeil auch korrekt angezeigt.
Nur die Darstellung im HTML sträubt sich.
Die vererbten Klassen habe ich mittlerweile auch alle ausgehebelt.
Woran könnte das denn liegen?
Hat jemand eine Idee?
Danke schon mal
Bye, Transmitter
- Anmelden oder Registrieren um Kommentare zu schreiben
Bin zwar kein CSS-Experte,
am 05.10.2009 - 12:16 Uhr
Bin zwar kein CSS-Experte, aber das
list-style-image:url(img/pfeil-icon.gif);list-style-type:square;
kommt mir bissel komisch vor. Mit list-style-type legst du ja quasi das Aufzählungssymbol fest, wobei du da zwischen verschiedenen Standards wählen darfst. Mit list-style-image legst du selbst das Aufzählunszeichen fest. Macht also irgendwie keinen Sinn beides hintereinander zu machen. Lass doch mal list-style-type:square; einfach weg.
Bei Verwendung von Images
am 05.10.2009 - 12:57 Uhr
Bei Verwendung von Images fuer Listbullits in Linklisten sollte man die Images nicht auf die li Tags sondern als Backgroundimage auf die a Tags setzen. Grund: Die Browser stellen vergleichsweise untereinander die Image-Bullits nicht in korrekter Position dar. Images als Background im a Tag kann man positionieren.
------------------------
Quiptime Group
Ach super .. und ich sitze
am 05.10.2009 - 14:25 Uhr
Ach super .. und ich sitze mehrere Stunden da dran, dabei lag die Lösung einfach ein Element weiter unten.
#primarylinks li a{
color : #000000;
font-family : Verdana, Arial, Helvetica, sans-serif;
font-size : 12px;
font-weight : normal;
background-image : url(img/pfeil-icon.gif);
background-position : 0px;
background-repeat : no-repeat;
padding : 0px 0px 0px 10px;
}
Sieht prima aus, genau so wollte ich es haben.
Vielen Dank.