CODEWITHSUNDEEP
htmlcssimage
Digo Gomes
Digo Gomes

Reputation: 63

How to fit an image inside a div without changing the img tag?

I'm using currently trying to achive this in a rich-text based template system in which the user can switch the image to another of any size.

The system only allows me to style inline, so that <img src="path/image.jpg" style="max-width: 100%; max-height: 100%;" > works fine UNTIL the user switch the image to another, deleting any previous styling, replacing with a new <img> with its own width and height.

I've already tried using <style></style> and <style type="text/css"></style>and <link>, but the system ignores it.

Can I solve this inline without changing the img tag? This is the code as it is today:

<div style="float: left; text-align: center; display:inline-block; margin: 0 auto; width:450px;height:450px;">
<img src="http://i.imgur.com/cnI4YIs.png" width="450px" height="450px" alt="" />
</div>

Upvotes: 1

Views: 158

Answers (1)

Digo Gomes
Digo Gomes

Reputation: 63

Thank you, but now i think it is good in its own way. I'm not sure if it works with JS, but it seems that when I make changes inside the template, and then I copy the code to paste in the actual site that will publish the template ad (that also works with rich-text input), the changes automatically goes inline.

In other words, I keep <style></style> elements in the template system, save it in the publish system, and avoid making any changes in it.

I don't know how to explain this, or why it's happening, but it works anyway...

PS: both sites use TinyMCE to edit the code, so it may be useful to look for answers about TinyMCE configuration (like enabling the tag <style>). Of course, only if you have admin access to it. I didn't.

Upvotes: 1

Related Questions