Diese Webseite enthält Bilder, die von Wordpress eingefügt wurden. Der Code zum Einfügen des ersten Bildes lautet:
[caption id="attachment_887" align="alignnone" width="604"]
<a href="http://steven.doig.com.au/files/2013/06/Forest_Legacy_m.jpg">
<img class="size-large wp-image-887" alt="a Forest Legacy group" src="http://steven.doig.com.au/files/2013/06/Forest_Legacy_m-1024x681.jpg" width="1024" height="681" />
</a> a Forest Legacy group[/caption]
Dieses Bild wird von CSS gesteuert:
#content .wp-caption a img {
width: 614px;
height: auto;
}
Ich möchte dieses Bild reaktionsschnell machen. Ich habe das CSS eingefügt:
@media (max-width:988px) {
#content .wp-caption a img {
width: 99.03225806%; /* 614/620 */
height: auto;
}
}
Die DIV.wp-Beschriftung bleibt jedoch bei 604px, wie im Wordpress-Beitrag angegeben. Ich habe versucht, dies als Prozentsatz anzugeben (97,41935483%), aber Wordpress hat es als 104px neu interpretiert.
Das Inline-CSS überschreibt das CSS, das ich in das Stylesheet eingefügt habe.
<div id="attachment_887" class="wp-caption alignnone" style="width: 614px">
Irgendwelche Ideen, wie ich die .wp-Beschriftung reaktionsfähig machen kann?
quelle