css - How can I make an image max-width respect a percentage parent div width? -


i have 2 floated left divs.. 1 width = 20% width = 80%

inside 20% width div have image 300px width...

if 20% area smaller 300px, make image resize , fits inside 20% div...

something this:

<div class="container">     <div style="float:left; width:20%;">         <img src="imagewith300pxwidth.jpg" />     </div>     <div style="float:left; width:80%;"></div>  </div> 

.image {   width: 100%;   max-width: 300px; } 
  • if container width larger 300px, image stick 300px;
  • if container width smaller image resize fit it

Comments

Popular posts from this blog

jquery - How do you format the date used in the popover widget title of FullCalendar? -

asp.net mvc - SSO between MVCForum and Umbraco7 -

Python Tkinter keyboard using bind -