Link mit Grafik mittig
Andreas
- css
Hi,
ich habe eine Navigation mit icon und einem Link.
Per CSS entsprechend formatiert:
a.mainnav {
margin : 0px;
padding : 0px;
font-size : 11px;
width : 135px;
background-color : #ECEAD8;
background-image: url(http://www.domain.de/icon.gif);
background-repeat: no-repeat;
text-indent : 10px;
}
Leider werden die icons nicht mittig sondern über dem Text angezeigt.
Wie kann ich das ändern?
Kann ich den linken Abstand der Hintergrundgrafik irgendwie verändern?
Gruß Andreas
Hallo,
Kann ich den linken Abstand der Hintergrundgrafik irgendwie verändern?
http://de.selfhtml.org/css/eigenschaften/hintergrund.htm#background_position
Deine Angabe für 'width' bleibt übrigens in richtig funktionierenden Browsern
wirkungslos, solange du dem a-Element nicht auch ein 'display: block;'
mitgibst.
Gruß, Jan
Hi,
mit background_position:left hats funktioniert, danke.
Jetzt fehlt halt nur noch ein paar Pixel für den Abstand
Gruß Andreas
Hallo,
Jetzt fehlt halt nur noch ein paar Pixel für den Abstand
Dann lese halt nochmal die Erklärung auf der verlinkten Seite.
Mit background-position: können Sie festlegen, wo die linke obere Ecke der Hintergrundgrafik sein soll. Der erste Wert steht für die horizontale, der zweite für die vertikale Position. Bezugspunkt ist das HTML-Element, für das die Hintergrundgrafik definiert wird. Erlaubt sind Seite numerische Angaben...
Du kannst den linken Abstand also auf den Pixel genau angeben.
Und schau dir die Seite mal z.B. mit Firefox an. Der wird dein 'width: 135px;'
richtigerweise ignorieren.
Gruß, Jan
Hi,
Also FF zeigt die Navigation schon richtig an, liegt vieleicht daran dass die Tabellenzelle 135px breit ist.
Siehe hier: http://www.access-o-mania.de
Den Link werde ich noch anschauen, danke.
Andreas
hi,
Leider werden die icons nicht mittig sondern über dem Text angezeigt.
Vermutlich eher unter - schließlich handelt es sich um Hintergrundbilder.
Wie kann ich das ändern?
Kann ich den linken Abstand der Hintergrundgrafik irgendwie verändern?
Ja - und du kannst sogar _selber nachlesen_ [1], wie das geht:
Hintergrundfarben und -bilder
gruß,
wahsaga
[1] hoffentlich jedenfalls.