Links in Twenty Seventeen nicht mehr unterstreichen

Issmitlust

Hi,

ich werde noch wahnsinnig. Die Links im Theme Twenty Seventeen sollten eigentlich nicht unterstrichen werden. Werden sie aber.

In der CSS steht alles auf text-decoration:none.
Ich habe zusätzlich span-Klassen um die Links gelegt, .txtlink a {text-decoration:none;}, habe in die Links selbst <a ...><span style="text-decoration:none!important">Anker </span></a> hineingesetzt - nix funktioniert.

Im Safari "Element untersuchen" wird mir angezeigt, dass die Links über Media unterstrichen werden - was ich aber nicht finde.

HILFE :-)

Weiß jemand, wie ich das loswerde?

Beispielseite: http://rauchenistbloed.de/start/rauchen-aufhoeren/

Werbepost

Hallo!

Wenn du gerade an deiner Website arbeitest oder dein aktuelles Hosting überdenkst: Wir betreiben mit NetzLiving eine Hosting-Plattform, die speziell auf Performance, Sicherheit und einfache Verwaltung ausgelegt ist.

✔️ Schnelle Ladezeiten (optimiert für WordPress & Co.)
✔️ Deutsche Server & DSGVO-konform
✔️ Persönlicher Support (kein 0815-Ticket-System)

Mehr erfahren

Henk1060

schau mal in deine style.csss zeile 1171

[FONT=Consolas].entry-content a[/FONT]

[FONT=Consolas]

[COLOR=#C80000]-webkit-box-shadow[/COLOR]: inset 0 -1px 0 rgba(15, 15, 15, 1);
[COLOR=#C80000]box-shadow[/COLOR]: inset 0 -1px 0 rgba(15, 15, 15, 1);
[COLOR=#C80000]-webkit-transition[/COLOR]: color 80ms ease-in, -webkit-box-shadow 130ms ease-in-out;
[COLOR=#C80000]transition[/COLOR]: color 80ms ease-in, -webkit-box-shadow 130ms ease-in-out;
[COLOR=#C80000]transition[/COLOR]: color 80ms ease-in, box-shadow 130ms ease-in-out;
/* [COLOR=#C80000]transition[/COLOR]: color 80ms ease-in, box-shadow 130ms ease-in-out, -webkit-box-shadow 130ms ease-in-out; */

[/FONT]
[FONT=Consolas]}[/FONT]

Henk1060

und zeile 194
[FONT=Consolas].colors-custom .entry-content a, [/FONT]

Issmitlust

Danke, Henk! Ehrlich gesagt, verstehe ich die inset ... -webkit-box-shadow - Angaben nicht so gut. Ich habe sie aber mal testweise auskommentiert - das macht aber keinen Unterschied. Und Zeile 194 ist bei mir: input {overflow: visible;}
.colors-custom finde ich der style.css gar nicht. Hm ...

Der Gerd

Habe das gleiche Problem und bekomme diesen blöden Unterstrich nicht weg. Hat keiner eine Lösung?

Henk1060

ich kann nur das sagen was ich sehe ,))

hier noch mal was zum sehen.
Alles andere sollte man sich auch selbst erlernen und googlen ;)

Der Gerd

Ja so schaut es im Quelltext aus, in der style.css aber leider ganz anders. Asche auf mein Haupt, anscheinend werde ich zu alt für so was.

Henk1060

sehe gerade das die zeile 194 direkt im html code ausgeben wird.
hast das theme die möglichkeit einer custom css... zum überschreiben... wenn ja....

dann versucht das

colors-custom .entry-content a {
box-shadow: inset 0 0px 0 #f84d3b;
-webkit-box-shadow: inset 0 0px 0 #f84d3b;
}

Edi

Du kannst die Linie so ausblenden:

Code

.entry-content a, .entry-summary a, .widget a, .site-footer .widget-area a, .posts-navigation a, .widget_authors a strong {
   box-shadow: none;
}

Allerdings ist dies Unsinn, weil Links aus Gründen der Accessibility unterstrichen sein sollten. Dazu beispielsweise:

http://www.barrierefreies-webdesign.de/knowhow/links-unterstreichen/

Der Gerd

Hallo Edi,

ich gebe Dir Recht, die Text-Links sollten schon unterstrichen sein. Leider habe ich diesen Unterstrich aber auch unter Fotos und Grafiken die eine Verlinkung haben und das stört der Optik. Über eine Lösung dieses Problems würde ich mich jedenfalls sehr freuen. Alle bisherigen Vorschläge führten nicht zum gewünschten Erfolg.

Der Gerd

Problem gelöst!

Henk1060

dann teile doch deine Lösung ;)

Edi

Der Code sollte funktionieren. Oder hast Du ein Beispiel, wo es nicht geht?

Der Gerd

Hier habe ich die Werte verändert und schon war die Linie unter den Fotos verschwunden.

.widget a img {
-webkit-box-shadow: 0 10px 0px 0px #fff;
box-shadow: 0 10px 0px 0px #fff;
}

Edi

Die Frage beziehungsweise Feststellung lautete halt: "Die Links im Theme Twenty Seventeen sollten eigentlich nicht unterstrichen werden." ;-)

Issmitlust

Entschuldigung, dass ich erst jetzt antworte - ich habe an der falschen Stelle nachgesehen und dachte, der Thread ging nicht weiter. Ging er aber doch.
Danke euch!

Ich habe allerdings alle vorgeschlagenen Lösungen versucht - so wie es aussieht, ist der Unterstrich in das Theme hinein gelötet. :-) Verflixt.
Oder, Henk, in deinem Screenshot, wie hast du das hinbekommen, dass nicht unterstrichen wurde? Wahrscheinlich mit dem vorgeschlagenen Code - der bei mir aber nichts bewirkt.

Accessibility ist ein Thema, richtig. Ich habe selbst schon Blinde am Computer geschult, deren Programme geben den Link auch ohne Unterstrich aus.

chezzone

Issmitlust: Probier mal folgendes im CSS

Code

[COLOR=#303942][FONT=Menlo][COLOR=#888888][COLOR=#222222].colors-custom .entry-content a[/COLOR], .colors-custom .entry-summary a,.colors-custom .widget a,.colors-custom .site-footer .widget-area a,.colors-custom .posts-navigation a, .colors-custom .widget_authors a strong[/COLOR] {
box-shadow: none;
[/FONT][/COLOR]
[COLOR=#303942][FONT=Menlo]}[/FONT][/COLOR]

Issmitlust

chezzone JAAAA! Danke dir. Funktioniert. :-D

Issmitlust

Sorry, chezzone, darf ich nochmal? Wie komme ich denn jetzt an die Gestaltung der Hover-Unterstreichung heran? Ich habe es so versucht:

PHP

.colors-custom .entry-content a:hover, .colors-custom .entry-summary a:hover,.colors-custom .widget a:hover,.colors-custom .site-footer .widget-area a:hover,.colors-custom .posts-navigation a:hover, .colors-custom .widget_authors a:hover strong {
-webkit-box-shadow: inset 0 -1px 0 rgba(42, 78, 106, 1);
box-shadow: inset 0 -1px 0 rgba(rgba(42, 78, 106, 1); 
}

Wieder ändert sich der Strich nicht ...

barbdi352

ich hab's - falls es noch jemand benötigt ;)

.entry-content a:focus,
.entry-content a:hover,
.entry-summary a:focus,
.entry-summary a:hover,
.comment-content a:focus,
.comment-content a:hover,
.widget a:focus,
.widget a:hover,
.site-footer .widget-area a:focus,
.site-footer .widget-area a:hover,
.posts-navigation a:focus,
.posts-navigation a:hover,
.comment-metadata a:focus,
.comment-metadata a:hover,
.comment-metadata a.comment-edit-link:focus,
.comment-metadata a.comment-edit-link:hover,
.comment-reply-link:focus,
.comment-reply-link:hover,
.widget_authors a:focus strong,
.widget_authors a:hover strong,
.entry-title a:focus,
.entry-title a:hover,
.entry-meta a:focus,
.entry-meta a:hover,
.page-links a:focus .page-number,
.page-links a:hover .page-number,
.entry-footer a:focus,
.entry-footer a:hover,
.entry-footer .cat-links a:focus,
.entry-footer .cat-links a:hover,
.entry-footer .tags-links a:focus,
.entry-footer .tags-links a:hover,
.post-navigation a:focus,
.post-navigation a:hover,
.pagination a:not(.prev):not(.next):focus,
.pagination a:not(.prev):not(.next):hover,
.comments-pagination a:not(.prev):not(.next):focus,
.comments-pagination a:not(.prev):not(.next):hover,
.logged-in-as a:focus,
.logged-in-as a:hover,
a:focus .nav-title,
a:hover .nav-title,
.edit-link a:focus,
.edit-link a:hover,
.site-info a:focus,
.site-info a:hover,
.widget .widget-title a:focus,
.widget .widget-title a:hover,
.widget ul li a:focus,
.widget ul li a:hover {
color: #504f4f;
-webkit-box-shadow: inset 0 0 0 rgba(0, 0, 0, 0), 0 0px 0 rgba(0, 0, 0, 1);
box-shadow: inset 0 0 0 rgba(0, 0, 0, 0), 0 0px 0 rgba(0, 0, 0, 1);
}

Willkommen! Melden Sie sich an oder registrieren Sie sich.

Links in Twenty Seventeen nicht mehr unterstreichen

Jetzt mitmachen!