I am facing a challenge in resizing the image width and height using CSS. The upload image button changes dynamically in my application, making it impossible for me to assign an id or class name to the img or div tags through my code.
Here is the current code which needs to have its image width and height dynamically set through CSS, without being able to use inline styles:
<div class="note-editable panel-body" contenteditable="true" style="height: 300px;">
<p><img src="data:image/jpeg;base64,... " data-filename="xyz.png" style="width:550px;">
</div>
I have attempted to resize the image with the following CSS code, but unfortunately, the image remains unchanged:
.note-editable .panel-body > img {
width:200px;
height:200px;
}
If anyone has any suggestions or solutions, your input would be greatly appreciated.