Como setar o CSS max-width de uma imagem igual ao natural width da imagem? Sem JS #1712
Replies: 5 comments
-
Irmao, se você quer a imagem com tamanho natural, você não mexe em width, nem width nem max-width... Se ela tem 1920px de largura, ela sempre terá isso, não se preocupe, ela não aumentará |
Beta Was this translation helpful? Give feedback.
-
@renanlbl provavelmente ele está pensando em responsividade e vai precisar diminuir a imagem quando a tela for menor, ai não vai conseguir usar ela ao natural... @felquis da uma olhada no natualWidth/height. Já é suportado nos browsers atuais, mas já faz pensando em um fallback. Especificação: https://html.spec.whatwg.org/multipage/embedded-content.html#dom-img-naturalwidth |
Beta Was this translation helpful? Give feedback.
-
https://codepen.io/valkervieira/pen/mdJmQvy Usando |
Beta Was this translation helpful? Give feedback.
-
#1712 (comment) o problema aqui é que naturalWidth está apenas no JavaScript por enquanto. #1712 (comment) já aqui o demo funciona como esperado, porém |
Beta Was this translation helpful? Give feedback.
-
@borghettinho siim, verdade. @felquis mas o max-width = natural with não seria responsivo sózinho, e se usado com width: 100% seria o mesmo que max-width: 100%, particularmente prefiro assim... |
Beta Was this translation helpful? Give feedback.
Uh oh!
There was an error while loading. Please reload this page.
-
Oi pessoal, tenho uma imagem centralizada na tela, e gostaria que o max-width fosse igual ao natural width da imagem, assim ela nunca vai ficar maior do que ela realmente é... alguém sabe se isso é possível sem JavaScript?
Beta Was this translation helpful? Give feedback.
All reactions