Resize Cellular Images

Asked

Viewed 110 times

1

I have a post page, which receives this setting for the images that comes from the database: 

.post-content img{
    max-width:100%;
}

What happens is, when you see the photo on the phone, they get elongated, slightly deformed, someone knows some way to resize them but keeping the minimum of her viewing pattern?

css
  • 1

    Buddy, I don’t know if you’re using bootstrap, but inside bootstrap there is img-Responsive

  • 2

    This should answer you: https://answall.com/questions/32936/redu-o-tamanho-de-uma-imagem-e-manter-a-propose%C3%A7%C3%A3o-com-css

  • i am receiving the images dynamically, from ck editor 4, so I just want to apply the configuration to the images, but they already come with a set class from the editor, how can I do?

  • 2

    @gabrielfalieri img-Responsive Bootstrap is just put width:100% and heigt:auto in the images, the same thing he already has...

  • I’ll add the heigt:auto, and see if it solves!

  • the problem is that the images seemed deformed

  • 1

    Daniel create a new . css and index it last in your document, after you have already indexed all the . css index that new . css, in it create a class with the same name of the class that is coming from the bank and in this class "revert" or zero the value of the properties that you do not want doing an override of these properties. READ the marked links you can solve there

  • very thank you! I will try the tips and send the feedback!

  • 1

    Try adding one as well width: 100%;

  • It didn’t work that way Sam

  • https://answall.com/questions/32936/redu-sized-de--imagem-e-manter-a-propose%C3%A7%C3%A3o-com-css ?

  • 1

    Yes, by placing within a @media Scree and (max-width:768px) { . class{ seu css} rule} ... Search for "media querie css" in google

  • SOLVED FRIENDS!! Thanks the support!!! , I’ll leave the CSS snippet here for anyone who wants to solve something like: <style> . post-content img{ max-width:100%; } </style> <style> @media (max-width: 600px) { . post-content img { max-width:300px; max-height:350px; width:>

Show 8 more comments
No answers

Browser other questions tagged css

You are not signed in. Login or sign up in order to post.