EuroCent
Klappstuhl 2.0
Hallo zusammen,
ich sitze vor einem Problem![Big grin :D :D](https://cdn.jsdelivr.net/joypixels/assets/8.0/png/unicode/64/1f600.png)
Und zwar möchte Ich, dass wenn man über einen Link hoverd, dass er nicht den Typischen underline bekommt, sondern einen Border bzw. background der einen Verlauf hat.
mein versuch war:
Damit bekomm Ich zwar das Ergebnis.
Aber der Border ist deutlich länger als der Text und das soll nicht sein.![Smile :) :)](https://cdn.jsdelivr.net/joypixels/assets/8.0/png/unicode/64/1f642.png)
Hat hier jemadn eine Idee, ich denke mal dass die sehr Simple sein wird![Frown :( :(](https://cdn.jsdelivr.net/joypixels/assets/8.0/png/unicode/64/1f641.png)
Nur komm Ich aktuell nicht drauf :/
[EDIT]
Hab vergessen zu erwähnen dass die Links in einer liste sind![Big grin :D :D](https://cdn.jsdelivr.net/joypixels/assets/8.0/png/unicode/64/1f600.png)
ich sitze vor einem Problem
![Big grin :D :D](https://cdn.jsdelivr.net/joypixels/assets/8.0/png/unicode/64/1f600.png)
Und zwar möchte Ich, dass wenn man über einen Link hoverd, dass er nicht den Typischen underline bekommt, sondern einen Border bzw. background der einen Verlauf hat.
mein versuch war:
CSS:
a.link-item:hover::after {
display: block;
position: absolute;
content: "";
width: 100%;
border: 0.3rem solid #000;
margin: 0 !important;
padding: 0 !important;
}
Damit bekomm Ich zwar das Ergebnis.
Aber der Border ist deutlich länger als der Text und das soll nicht sein.
![Smile :) :)](https://cdn.jsdelivr.net/joypixels/assets/8.0/png/unicode/64/1f642.png)
Hat hier jemadn eine Idee, ich denke mal dass die sehr Simple sein wird
![Frown :( :(](https://cdn.jsdelivr.net/joypixels/assets/8.0/png/unicode/64/1f641.png)
Nur komm Ich aktuell nicht drauf :/
[EDIT]
Hab vergessen zu erwähnen dass die Links in einer liste sind
![Big grin :D :D](https://cdn.jsdelivr.net/joypixels/assets/8.0/png/unicode/64/1f600.png)
HTML:
<ul>
<li>
<a href="#" class="link-item">Test</a>
</li>
</ul>
Zuletzt bearbeitet: