css: a p img - problem

Hi!

Ich würde ganz gerne Links mit border gestalten.
Es gibt nun ein Problem mit verlinkten Bildern innerhalb der Posts.
Diese bekommen nämlich auch den Rahmen zugewiesen, was eigentlich nicht so sein sollte.
Genauer gesagt umgibt die Bilder ein <p>, welches den Rahmen bekommt.

Nun kriege ich die Bilder nicht mit css zu fassen, um es dort auszuschalten.
D.h. die Bilder bekomme ich natürlich schon, nur nicht das <p>, welches die Links umfasst und aus einem mir unbekannten Grund den Link bekommt.
Obwohl der Quelltext des veröffentlichen posts so aussieht: <p><a><Img></a></p>
Komscherweise wird der border wird dem äußeren p zugewiesen.

Im css steht zu links nur das: p a:link {border:...;}

Hat jemand eine Idee, wie das möglichst mit css zu lösen wäre? Oder kennt jemand einen Editor, der <br /> statt <p> verwendet, um Absätze zu machen? Klar, wäre nicht valide, aber das ist in diesem Fall nicht wichtig.
An Editoren habe ich jetzt den normalen tiny, tinymce advanced und fck getestet.

:) m.

Ja, mittlerweile ist es mir auch gedämmert, dass es ohne eindeutige Klassen nicht gehen wird.
Die Bilder kommen von einem Plugin. Ich denke auch, dass ich es hinbekäme, dem beizubringen den <img> tag mit einer Klasse zu versehen.

Das Problem ist ja aber nicht, dass ich nicht auf die img's mit css zugreifen kann - das geht ja - sondern dass die Formatierung dem <p> zugewiesen wird, welches das Bild umgibt.

Und die <p>'s kommen vom Editor.

Na das ist doch das Problem! :D

Das funktioniert alles nicht.

OK. hier nochmal das komplette css:

.entry p a:link, .entrytext p a:link, .entry p a:visited, .entrytext p a:visited {
	border-bottom:#666 dotted 1px;
	}

auf ganz blöd habe ich das alles nochmal hinzugefügt:

.entry p a:link img {
	border-bottom:none !Important;
	}
	
.entry a:link img {
	border-bottom:none !Important;
	}
	
.entry p img {
	border-bottom:none !Important;
	}
	
.entry img {
	border-bottom:none !Important;
	}

und hier ist der Code auf der Seite:

div class="entry">
				<p><a href="http://www.usdesignstudio.co.uk/" title="Us Design Studio" target="_blank">Us Design Studio</a>, always famous for blurring the boundaries between design and art, made a new piece:</p>
<p><a href="http://www.soundofsirens.net/wp-content/uploads/2008/03/whole_human.jpg" title="Whole Human"><img src="http://www.soundofsirens.net/wp-content/uploads/2008/03/whole_human1.jpg" alt="Whole Human" /></a></p>

Und hier die Seite selbst. Habs jetzt mal so gelassen, damit ihr seht, was ich meine: Sound Of Sirens » Blog Archive

(ja, ich weiss - die pagenav oben. Und das der Rahmen rechts 10 pixel raussteht ist auch normal, weil die Bilder alle einen margin von 10px nach rechts haben wegen Textumfluss)

:) m.

Das gleiche Problem existiert übrigens auch, wenn ich aufs p verzichte und nur sage .entry a {border...} :confused:

Zitat von marX

Falsch. Die Rahmen werden dem Link-Element <a> hinzugefügt - und die benötigen eine Klasse, wenn Bilder verlinkt sind, um das Verhalten abzustellen (siehe Alphawolfs Posting). Das Problem ist, dass du mit CSS nicht sagen kannst: "Wenn der Link ein Bild enthält, dann keinen Rahmen, sonst Rahmen".

:-D Danke! Ich hab endlich eine Idee...

Ui! Das mit den Attributen kannte ich noch gar nicht! :D
Man lernt nie aus...

Ich habs jetzt auch hinbekommen.
Zwar nicht mit euren Lösungen (funktionierren beide nicht) - aber über das target habe ich sie bekommen:

.entry p a, .entrytext p a {
	text-decoration:none;
	border-bottom:none;
	}
	
.entry p a[target="_blank"]:link, .entrytext p a[target="_blank"]:link, .entry p a[target="_blank"]:visited, .entrytext p a[target="_blank"]:visited {
	text-decoration:none;
	border-bottom:#666 dotted 1px;
	}

Darf jetzt natürlich nur niemand ein Bild nach extern verlinken, ansonsten wird kein target eingefügt.
Damit könnte ich erstmal leben.

Vielen Dank! :)

Wenn meine Co-Autoren anfangen, wie wild Bilder nach aussen zu verlinken, melde ich mich nochmal ;)