html - How can I make image fit in div (django)? -


i'm trying make uploaded image(media not static) fit div element.

it seems found solution here : how auto-resize image fit div container

but doesn't work me.

the size of dive different depending on size of image uploaded. enter image description here

this css img

img {     padding: 0;     display: block;     margin: 0 auto auto 0;     max-height: 100%;     max-width: 100%; } 

and part of html.

<ul class="items col-3 gap">     {% album in albums %}         <li class="item thumb {{ album.day }}">             <figure>                  <div class="icon-overlay icn-link">                     <a href="{{ album.get_absolute_url }}"><img src="{{ album.get_image_url }}" /></a>                 </div><!-- /.icon-overlay -->                  <figcaption class="bordered no-top-border">                     <div class="info">                         <h4><a href="{{ album.get_absolute_url }}">{{ album }}</a></h4>                     </div><!-- /.info -->                 </figcaption>              </figure>         </li><!-- /.item -->     {% endfor %} </ul><!-- /.items --> 

how can show images consistent size? need help

instead of using 100% use specific value 100px(or else) fix. not work image smaller 100px

img {     padding: 0;     display: block;     margin: 0 auto auto 0;     max-height: 100px;     max-width: 100px;    } 

the below code work type of images

 img {     padding: 0;     display: block;     margin: 0 auto auto 0;      height: 100px;     width: 100px;     max-height: 100px;     max-width: 100px;    } 

Comments

Popular posts from this blog

amazon web services - S3 Pre-signed POST validate file type? -

c# - Check Keyboard Input Winforms -