tag:forum.selfhtml.org,2005:/selfLinks mit Hintergrundbild, dass höher als die Zeile ist – SELFHTML-Forum2005-11-13T20:19:00Zhttps://forum.selfhtml.org/self/2005/nov/13/links-mit-hintergrundbild-dass-hoeher-als-die-zeile-ist/897286#m897286Marc2005-11-13T14:09:55Z2005-11-13T14:09:55ZLinks mit Hintergrundbild, dass höher als die Zeile ist<p>Ich habe ein Problem mit meinen Links:</p>
<p>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...</p>
https://forum.selfhtml.org/self/2005/nov/13/links-mit-hintergrundbild-dass-hoeher-als-die-zeile-ist/897287#m897287Zeromancerzeromancer007-selfhtml@yahoo.de2005-11-13T14:50:36Z2005-11-13T14:50:36ZLinks mit Hintergrundbild, dass höher als die Zeile ist<p>Hallo Marc,</p>
<blockquote>
<p>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...</p>
</blockquote>
<p>kann ich mir grad schlecht vorstellen. Wie wäre es mit einem Link zu einer Testseite?</p>
<p>Man kann Hintergrundbilder auch positionieren:</p>
<pre><code class="block language-css">
<span class="token selector">a:hover</span> <span class="token punctuation">{</span><span class="token property">background</span><span class="token punctuation">:</span>#farbcode <span class="token url"><span class="token function">url</span><span class="token punctuation">(</span><span class="token string url">'bild.jpg'</span><span class="token punctuation">)</span></span> top left no-repeat<span class="token punctuation">;</span><span class="token punctuation">}</span>
</code></pre>
<p>Mit freundlichen Grüßen,<br>
André</p>
https://forum.selfhtml.org/self/2005/nov/13/links-mit-hintergrundbild-dass-hoeher-als-die-zeile-ist/897288#m897288Marc2005-11-13T15:10:51Z2005-11-13T15:10:51ZLinks mit Hintergrundbild, dass höher als die Zeile ist<blockquote>
<p>Hallo Marc,</p>
<blockquote>
<p>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...</p>
</blockquote>
<p>kann ich mir grad schlecht vorstellen. Wie wäre es mit einem Link zu einer Testseite?</p>
<p>Man kann Hintergrundbilder auch positionieren:</p>
<pre><code class="block language-css"></code></pre>
</blockquote>
<blockquote>
<p>a:hover {background:#farbcode url('bild.jpg') top left no-repeat;}</p>
</blockquote>
<pre><code class="block">
>
> 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.
</code></pre>
https://forum.selfhtml.org/self/2005/nov/13/links-mit-hintergrundbild-dass-hoeher-als-die-zeile-ist/897289#m897289Zeromancerzeromancer007-selfhtml@yahoo.de2005-11-13T15:16:54Z2005-11-13T15:16:54ZLinks mit Hintergrundbild, dass höher als die Zeile ist<p>Hallo Marc,</p>
<blockquote>
<p>Ich wollte zwei verschiedene Arten von Links machen, die sich im Grunde nur durch die Größe der HIntergrundbilder unterscheiden.</p>
</blockquote>
<p>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.</p>
<p>Mit freundlichen Grüßen,<br>
André</p>
https://forum.selfhtml.org/self/2005/nov/13/links-mit-hintergrundbild-dass-hoeher-als-die-zeile-ist/897290#m897290Marc2005-11-13T15:32:27Z2005-11-13T15:32:27ZLinks mit Hintergrundbild, dass höher als die Zeile ist<blockquote>
<p>Hallo Marc,</p>
<blockquote>
<p>Ich wollte zwei verschiedene Arten von Links machen, die sich im Grunde nur durch die Größe der HIntergrundbilder unterscheiden.</p>
</blockquote>
<p>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.</p>
<p>Mit freundlichen Grüßen,<br>
André</p>
</blockquote>
<p>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..</p>
https://forum.selfhtml.org/self/2005/nov/13/links-mit-hintergrundbild-dass-hoeher-als-die-zeile-ist/897291#m897291Zeromancerzeromancer007-selfhtml@yahoo.de2005-11-13T16:35:10Z2005-11-13T16:35:10ZLinks mit Hintergrundbild, dass höher als die Zeile ist<p>Hallo Marc,</p>
<blockquote>
<p>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..</p>
</blockquote>
<p>ich gehe jetzt einmal davon aus, dass du deinen Links feste Maße zugewiesen hast. Poste bitte relevanten Quelltext!</p>
<p>Mit freundlichen Grüßen,<br>
André</p>
https://forum.selfhtml.org/self/2005/nov/13/links-mit-hintergrundbild-dass-hoeher-als-die-zeile-ist/897292#m897292Marc2005-11-13T16:41:28Z2005-11-13T16:41:28ZLinks mit Hintergrundbild, dass höher als die Zeile ist<blockquote>
<p>Hallo Marc,</p>
<blockquote>
<p>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..</p>
</blockquote>
<p>ich gehe jetzt einmal davon aus, dass du deinen Links feste Maße zugewiesen hast. Poste bitte relevanten Quelltext!</p>
<p>Mit freundlichen Grüßen,<br>
André</p>
</blockquote>
<p>Danke für die Hilfe, in einem anderen Forum habe ich die Lösung gefunden:</p>
<p><link><br>
{<br>
display:inline;<br>
height: ...px;<br>
background-image:url(..);<br>
padding-left:...px;<br>
float:left;<br>
}<br>
Dann ist die Schrift vertikal zentriert, und zwar in IE und FF</p>
https://forum.selfhtml.org/self/2005/nov/13/links-mit-hintergrundbild-dass-hoeher-als-die-zeile-ist/897293#m897293Zeromancerzeromancer007-selfhtml@yahoo.de2005-11-13T16:50:30Z2005-11-13T16:50:30ZLinks mit Hintergrundbild, dass höher als die Zeile ist<p>Hallo Marc,</p>
<blockquote>
<p><link><br>
{<br>
display:inline;<br>
height: ...px;<br>
background-image:url(..);<br>
padding-left:...px;<br>
float:left;<br>
}</p>
</blockquote>
<p>entschuldige bitte, aber das ist grober Unfug!</p>
<p>Du formatierst ein <a href="http://de.selfhtml.org/html/referenz/elemente.htm#link" rel="nofollow noopener noreferrer">Link-Element</a>? Wer erzählt dir denn so einen Schwachsinn. Und auch der Rest macht keinen guten Eindruck.</p>
<blockquote>
<p>Dann ist die Schrift vertikal zentriert, und zwar in IE und FF</p>
</blockquote>
<p>Aha. Glaube ich nicht. (s.o.)</p>
<p>Mit freundlichen Grüßen,<br>
André</p>
https://forum.selfhtml.org/self/2005/nov/13/links-mit-hintergrundbild-dass-hoeher-als-die-zeile-ist/897294#m897294MudGuardhttp://www.andreas-waechter.de/2005-11-13T20:19:00Z2005-11-13T20:19:00ZLinks mit Hintergrundbild, dass höher als die Zeile ist<p>Hi,</p>
<blockquote>
<blockquote>
<p><link><br>
{<br>
display:inline;</p>
</blockquote>
</blockquote>
<blockquote>
<p>Du formatierst ein <a href="http://de.selfhtml.org/html/referenz/elemente.htm#link" rel="nofollow noopener noreferrer">Link-Element</a>?</p>
</blockquote>
<p>Nein, tut er nicht.</p>
<p>Dafür müßte da</p>
<p>link<br>
{<br>
display:inline;</p>
<p>usw. stehen.<br>
Einen Selektor, der mit < beginnt, gibt es m.W. nicht. Damit ist der genannte Selektor ungültig, das zugehörige Ruleset muß ignoriert werden.<br>
Marc formatiert mit dem genannten Code also nichts.</p>
<p>cu,<br>
Andreas</p>
<div class="signature">-- <br>
<a href="http://www.Mud-Guard.de/" rel="nofollow noopener noreferrer">Warum nennt sich Andreas hier MudGuard?</a><br>
<a href="http://www.schreinerei-waechter.de/" rel="nofollow noopener noreferrer">Schreinerei Waechter</a><br>
Fachfragen per E-Mail halte ich für unverschämt und werde entsprechende E-Mails nicht beantworten. Für Fachfragen ist das Forum da.<br>
</div>