SELFHTML Forum Doku Wiki Blog

Forumsarchiv 2005, November
Links mit Hintergrundbild, dass höher als die Zeile ist

archivierte Beiträge lesen

  1. CSS Links mit Hintergrundbild, dass höher als die Zeile ist Marc 13. 11. 2005, 15:09

Links mit Hintergrundbild, dass höher als die Zeile ist

Marc 13. 11. 2005, 15:09

Ich habe ein Problem mit meinen Links:

Die Links haben eine Höhe von (testweise) 11px, zu jedem Link gehört ein Bild, dass ich per css als Hintergrundbild dem jeweleiligen Link zuordne. Das Problem ist jedoch, dass die Bilder 18px hoch sind. Die Schrift des Links muss außerdem vertikal zu den Bildern zentriert stehen - ich kriege es einfach nicht hin...

Links mit Hintergrundbild, dass höher als die Zeile ist

Zeromancer 13. 11. 2005, 15:50

Hallo Marc,

> Die Links haben eine Höhe von (testweise) 11px, zu jedem Link gehört ein Bild, dass ich per css als Hintergrundbild dem jeweleiligen Link zuordne. Das Problem ist jedoch, dass die Bilder 18px hoch sind. Die Schrift des Links muss außerdem vertikal zu den Bildern zentriert stehen - ich kriege es einfach nicht hin...

kann ich mir grad schlecht vorstellen. Wie wäre es mit einem Link zu einer Testseite?

Man kann Hintergrundbilder auch positionieren:


a:hover {background:#farbcode url('bild.jpg') top left no-repeat;}


Mit freundlichen Grüßen,
André

Links mit Hintergrundbild, dass höher als die Zeile ist

Marc 13. 11. 2005, 16:10

> Hallo Marc,
>
> > Die Links haben eine Höhe von (testweise) 11px, zu jedem Link gehört ein Bild, dass ich per css als Hintergrundbild dem jeweleiligen Link zuordne. Das Problem ist jedoch, dass die Bilder 18px hoch sind. Die Schrift des Links muss außerdem vertikal zu den Bildern zentriert stehen - ich kriege es einfach nicht hin...
>
> kann ich mir grad schlecht vorstellen. Wie wäre es mit einem Link zu einer Testseite?
>
> Man kann Hintergrundbilder auch positionieren:
>
>
> a:hover {background:#farbcode url('bild.jpg') top left no-repeat;}
>

>
> Mit freundlichen Grüßen,
> André

Ich habe leider keinen Link, da es nicht funktioniert...

Ich wollte zwei verschiedene Arten von Links machen, die sich im Grunde nur durch die Größe der HIntergrundbilder unterscheiden.

Links mit Hintergrundbild, dass höher als die Zeile ist

Zeromancer 13. 11. 2005, 16:16

Hallo Marc,

> Ich wollte zwei verschiedene Arten von Links machen, die sich im Grunde nur durch die Größe der HIntergrundbilder unterscheiden.

wie gesagt, Hintergrundbilder kann man positionieren. Das heißt, dass der Rest der Hintergrundes "abgeschnitten" wird. Oder du änderst per CSS die Maße des Linkes.

Mit freundlichen Grüßen,
André

Links mit Hintergrundbild, dass höher als die Zeile ist

Marc 13. 11. 2005, 16:32

> Hallo Marc,
>
> > Ich wollte zwei verschiedene Arten von Links machen, die sich im Grunde nur durch die Größe der HIntergrundbilder unterscheiden.
>
> wie gesagt, Hintergrundbilder kann man positionieren. Das heißt, dass der Rest der Hintergrundes "abgeschnitten" wird. Oder du änderst per CSS die Maße des Linkes.
>
> Mit freundlichen Grüßen,
> André

Das habe ich schon probiert - ein Problem bleibt: wenn ich die Höhe des Links ändere, z.B. in 18px, dann ist zwar im IE die SChrift vertikal zentriert, im FF bleibt sie jedoch unten..

Links mit Hintergrundbild, dass höher als die Zeile ist

Zeromancer 13. 11. 2005, 17:35

Hallo Marc,

> Das habe ich schon probiert - ein Problem bleibt: wenn ich die Höhe des Links ändere, z.B. in 18px, dann ist zwar im IE die SChrift vertikal zentriert, im FF bleibt sie jedoch unten..

ich gehe jetzt einmal davon aus, dass du deinen Links feste Maße zugewiesen hast. Poste bitte relevanten Quelltext!

Mit freundlichen Grüßen,
André

Links mit Hintergrundbild, dass höher als die Zeile ist

Marc 13. 11. 2005, 17:41

> Hallo Marc,
>
> > Das habe ich schon probiert - ein Problem bleibt: wenn ich die Höhe des Links ändere, z.B. in 18px, dann ist zwar im IE die SChrift vertikal zentriert, im FF bleibt sie jedoch unten..
>
> ich gehe jetzt einmal davon aus, dass du deinen Links feste Maße zugewiesen hast. Poste bitte relevanten Quelltext!
>
> Mit freundlichen Grüßen,
> André

Danke für die Hilfe, in einem anderen Forum habe ich die Lösung gefunden:

<link>
{
 display:inline;
 height: ...px;
 background-image:url(..);
 padding-left:...px;
 float:left;
}
Dann ist die Schrift vertikal zentriert, und zwar in IE und FF

Links mit Hintergrundbild, dass höher als die Zeile ist

Zeromancer 13. 11. 2005, 17:50

Hallo Marc,

> <link>
> {
> display:inline;
> height: ...px;
> background-image:url(..);
> padding-left:...px;
> float:left;
> }

entschuldige bitte, aber das ist grober Unfug!

Du formatierst ein Link-Element? Wer erzählt dir denn so einen Schwachsinn. Und auch der Rest macht keinen guten Eindruck.

> Dann ist die Schrift vertikal zentriert, und zwar in IE und FF

Aha. Glaube ich nicht. (s.o.)

Mit freundlichen Grüßen,
André

Links mit Hintergrundbild, dass höher als die Zeile ist

MudGuard 13. 11. 2005, 21:19

Hi,

> > <link>
> > {
> > display:inline;

> Du formatierst ein Link-Element?

Nein, tut er nicht.

Dafür müßte da

link
{
 display:inline;

usw. stehen.
Einen Selektor, der mit < beginnt, gibt es m.W. nicht. Damit ist der genannte Selektor ungültig, das zugehörige Ruleset muß ignoriert werden.
Marc formatiert mit dem genannten Code also nichts.

cu,
Andreas
--
Warum nennt sich Andreas hier MudGuard?
Schreinerei Waechter

Fachfragen per E-Mail halte ich für unverschämt und werde entsprechende E-Mails nicht beantworten. Für Fachfragen ist das Forum da.

© 1998-2014 SELFHTMLImpressumSoftware: Classic Forum 3.4