css - How to make thumbnail image 100% width inside a div (on WordPress), and not larger? -


(first off, let me not ask such basic-seeming question here if hadn't tried think of -- manipulating of involved variables.

the image loads in functions:

add_theme_support('post-thumbnails'); add_image_size('mobile-thumb', 800, 300); 

that size (800,300) problem. when display on mobile, stubbornly stays 800 wide. need 100% width of screen.

i styled

div.thumbnail-box { width:100%;  height: 100%;     background-color: #eee;     margin-bottom:10px;     margin-top:0px;     margin-left:0px; }  .the_post_thumbnail {  max-width:100%; }  .desktop-featured-image {  width:100%;  } 

i've tried inside , without div.

i've adjusted heights , widths.

my current html is:

<div class="thumbnail-box">                  <img width="800" height="300" src="http://website/wp-content/uploads/2015/05/obama-e1424474715102-800x300.jpg" class="attachment-banner-image wp-post-image" alt="obama-e1424474715102" />           </div> 

does know how display featured image @ 100% width of screen?

thank you

this:

img { max-width: 100%; height: auto; } 

makes images scale page, if they're larger parent div/container/whatever. if want scale featured images, should work:

.wp-post-image { max-width: 100%; height: auto; } 

Comments

Popular posts from this blog

python - TypeError: start must be a integer -

c# - DevExpress RepositoryItemComboBox BackColor property ignored -

django - Creating multiple model instances in DRF3 -