CSS: Link innerhalb einer Tabelle anders Formatieren

[Sebastian E. (s-engel)]

Hallo,

ich baue gerade ein Webseiten-Template für das Typesetter-CMS.
Genaugenommen bin ich bis auf kleine Designfehler fertig.

Ich hänge nun am folgendem Problem:
Für eine Fotogallerie nutze ich Tabellen mit einer Zelle als Rahmen.

Diese formatiere ich so:

table.picture{
  float:      left;
  width:      200px;
  background-color:  #EEEEEE;
  margin-right:    20px;
  margin-bottom:    10px;
  border-radius:    5px;
  border-style:    solid;
  border-width:    1px;
  
}

Beim Aufbau des Inhalts gebe ich beim CMS der Tabelle die class 
"picture" an.
Das Funktioniert auch soweit.
Doch der Hyperlink, welcher auf dem Bild selbst liegt wird entsprechend 
meiner main-div-class formatiert. Das ist bei mir gestrichelt 
unterstrichen.

#main a {
  color:      #0101ba;
  text-decoration:  none;
  border-bottom:    1px dashed;
}

Nun möchte ich aber die Links innerhalb meiner picture-table ohne 
Unterstreichung fomatieren.

Nach endloser rumsucherei finde ich nur solche Lösungen:

table.picture a:link {border-bottom:none;}

Ich habe entsprechend die Unterstreichung so formatiert, aber ohne 
Erfolg.

Vermutlich funkt mir das CMS dazwischen.

Weiß jemand zufällig wie ich eine Link-Formatierung in den 
table.picture{} Bereich angebe?

Vg
Sebastian

[Daniel A. (daniel-a)]

https://jsfiddle.net/qbyat4gx/

Sebastian E. schrieb:
> Nach endloser rumsucherei finde ich nur solche Lösungen:table.picture
> a:link {border-bottom:none;}

Wenn man das :link weglässt, ist das eigentlich auch richtig so. Du hast 
ein Priorisierungsproblem. Selectoren mit IDs sind höher priorisiert als 
solche mit Klassen oder Tagnamen. Siehe: 
https://developer.mozilla.org/de/docs/Web/CSS/Spezifit%C3%A4t

Erstmal die nicht funktionierende Version:
https://jsfiddle.net/qbyat4gx/6/

Mögliche lösungen sind die verwendung von !important, wovon ich abraten 
würde:
https://jsfiddle.net/qbyat4gx/1/

Oder statt IDs Klassen oder Tagnames zu verwenden:
https://jsfiddle.net/qbyat4gx/5/
https://jsfiddle.net/qbyat4gx/4/

Ich empfehle, immer Klassen statt IDs in CSS Regeln zu verwenden.

[Hax (Gast)]

Hi,

Liest sich für mich als würdest du einfach nur "border" mit 
"text-decoration" verwechseln...

div.picture a:link {text-decoration:none;}

http://www.w3schools.com/Css/css_pseudo_classes.asp

[Sebastian E. (s-engel)]

Aufgehoben ist nicht aufgeschoben...

Erstmal vielen Dank Daniel für die ausführliche  Erklärung.
Beim Versuch deinen Vorschlag umzusetzen gab's immer wieder Problemchen 
mit dem CMS.

Habe dann, da ich etwas Zeitdruck hatte, das Problem mit "important" 
gelöst. Vorübergehend.
Einen eleganten weg muss ich noch testen.

Vg
Sebastian