dynamisches sklarieren von im Beitrag hochgeladenen Bildern

Hallo liebe WP-Freunde,
ich erarbeite mir gerade ein responsive-Design für mein eigenes Theme. Ich habe ein Problem mit der Skalierung der Bilder, die ich innerhalb meinen Posts hochgeladen habe.

Normalerweise ist das Skalieren mit max-width:100% schnell geregelt - nur eben hier nicht.

Die Beitragsbilder richten sich nicht nach dem content-<div> aus. Stattdessen sieht es so aus als ob die zugewiesenen Breiten- und Höhenangaben als übergeordnetes <div> angesehen werden.

Bsp: ein Bild hat eine Breite von 1024px. Mit max-width:100% verändert sich die Breite des Bildes jedoch gar nicht. Es ist nicht dynamisch.
Verändere ich die Breite (etwa durch max-width:80%), so verändert sich die Breit des Bildes entsprechend der Ausgangsbreite (also 80% von 1024).

Ich weiß nicht, wie ich die Bilder skalieren kann, damit sie sich dem Content anpassen und nicht den eigenen Größenverhältnissen.

Für Anregungen und Lösungsvorschläge bedanke ich mich schon einmal im Voraus.

Beste Grüße

 

Hallo,
erstmal vielen Dank für die Antwort.

Ja, das ist genau das, was ich möchte. Ich habe max-width und width ausprobiert und beide verhalten sich bei mir identisch. Allerdings nicht so, wie ich es möchte.

Ich schicke dir mal den Link zu meinem Problem: vielleicht kannst du mir hier noch einmal weiterhelfen.
http://nuestra-america.de/dritter-beitrag/

Das Bild soll sich entsprechend des übergeordneten <div class="single-content">-Elementes anpassen. Leider macht es das bisher noch nicht.

Beste Grüße

 

Hallo, vielen Dank für die Antwort.


Ich schicke dir hier mal den Link zu meinem Problem: http://nuestra-america.de/dritter-beitrag/

Das Bild soll sich entsprechend des übergeordneten <div class="single-content">-Elementes anpassen. Leider macht es das bisher noch nicht.

Beste Grüße

 

Hi,
vielen Dank für den Hinweis. Ich habe mittlerweile auch einen Lösungsweg gefunden. Ich habe einfach die Größenverhältnisse der hochgeladenen Bilder im WP-Backend an die Breite meines Content-<div> angepasst. Das hat ebenfalls funktioniert. Letztendlich war die Lösung doch einfach - man muss nur drauf kommen