XHTMLforum

XHTMLforum (http://xhtmlforum.de/index.php)
-   CSS (http://xhtmlforum.de/forumdisplay.php?f=73)
-   -   Bild + Link -> white-space: nowrap? (http://xhtmlforum.de/showthread.php?t=40249)

tassetee 07.06.2006 13:20

Bild + Link -> white-space: nowrap?
 
Hallo Leute,

wieder ein kleines Problem: Ich möchte vor Links ein kleines Gif setzen. Allerdings sollen Bild und Link immer zusammen erscheinen, so wie das eben mit white-space: nowrap möglich ist. Da ich leider in SelfHtml nicht gefunden habe, in welchen Tags die white-space Angabe erlaubt ist, wollte ich hier mal nachfragen. Links sehen so aus:
Code:

Blindtext mit <a href="http://www.link.de"><img src="link.gif" border="0" alt="">http://www.link.de</a> Links
Habe versucht, mit <span style="white-space: nowrap"> anzufangen, aber das klappt nicht.
Weiß jemand eine Lösung? Vielen Dank!

edit: ähem. peinlich. Mit span gehts doch, ich hab vorhin den Bindestrich zwischen white und space vergessen. Sorry....

heiko_rs 07.06.2006 13:25

Einfacher (und schöner) geht's so:

a {
background: hier das GIF angeben;
padding-left: hier den nötigen Platz für's GIF angeben; }

tassetee 07.06.2006 13:26

oh, Danke sehr! Wird gleich ausprobiert :)

tassetee 07.06.2006 22:19

Jetzt habe ich meine Links mit pading-left versehen und schaue mir die Seite auf IE 5.01 an... der interpretiert das nicht... richtig? Ich hab selbst das Dean Edward IE7 Script mit ausprobiert, die Links bewegen sich kein bißchen nach rechts. Kann man da was machen? Meine Links sehen alle aus wie der hier:
Code:

<a href="index.php" style="background: url('navigation/link.gif') no-repeat; background-position: 0px 3px; padding-left: 16px;">Link</a>
Danke!

heiko_rs 07.06.2006 22:45

Zitat:

Zitat von tassetee

Jetzt habe ich meine Links mit pading-left versehen und schaue mir die Seite auf IE 5.01 an... der interpretiert das nicht... richtig?

Ja, das ist richtig, der IE macht das erst ab 5.5. Versuche mal testweise, dem Link "Layout" zu geben, durch height: 1px;, das müßte gehen (ich habe es allerdings noch nicht ausprobiert), wenn's klappt, poste nochmal, dann bekommst Du noch den entsprechenden Hack ;)

tassetee 07.06.2006 23:01

Wow, klappt, vielen Dank. Ich hab einfach display:block dazu gefügt.

heiko_rs 07.06.2006 23:13

Zitat:

Zitat von tassetee

Ich hab einfach display:block dazu gefügt.

Das geht natürlich auch. Ich war allerdings davon ausgegangen, daß der Link ein Inline-Element bleiben soll (obwohl Du natürlich nichts dergleichen geschrieben hattest), d.h. ohne weiteres im normalen Text stehen kann, und dann wäre "Layout" die Lösung gewesen, damit auch der IE 5.0 die padding-Angabe für den Link akzeptiert.

Schöne Grüße,
Heiko

tassetee 07.06.2006 23:17

Nagut, nach ein wenig Rumprobieren von verschiedenen Wegen, den Internet Explorer zu überlisten, bin ich auch zu height: 1px übergegangen. Danke sehr, klappt super!

heiko_rs 07.06.2006 23:33

Und Du weißt, daß weder der IE 7 noch andere Browser als der IE dieses sehen dürfen? Am besten sogar nur der IE 5.x. Also height: 1px; nur per Conditional Comment bzw. per IE-Hack einsetzen.


Alle Zeitangaben in WEZ +2. Es ist jetzt 08:51 Uhr.

Powered by vBulletin® Version 3.8.11 (Deutsch)
Copyright ©2000 - 2024, vBulletin Solutions, Inc.

© Dirk H. 2003 - 2023