Get a free trial // Grow your CSS skills // Land your dream job

Image will not resize inside my div

  • # October 4, 2012 at 9:31 am

    I am making a responsive website, and would like for my images to resize inside the divs when the browser window is stretched. I just accomplished this successfully on the last site I made, seemingly using the same technique. However, it is not working this time. To make my images resize, i use a large enough image so that it will work full screen, and then shrink down when the browser window shrinks. So, when I enter the HTML,
    I leave out the height and width so that it will adapt to the size of its container. Please let me know if you see something I don’t that would make this not work! The code I have for this site is below.


    <div id="contentwrapper">
    <div id="right">
    <div id="imgdiv"><img src="images/sample.png"/>


    #contentwrapper {
    width: 90%;
    margin-right: auto;
    margin-left: auto;
    #content {
    padding-left: 260px;
    #right {
    float: right;
    width: 25%;
    #rightImgdiv {
    width: 90%;

    # October 4, 2012 at 11:18 am

    rightImgdiv img {
    width: 100%;

    # October 4, 2012 at 11:28 am

    That’s it! How I missed that in my other code, I have no idea. Sometimes you just need fresh eyes :) Thanks!

Viewing 3 posts - 1 through 3 (of 3 total)

You must be logged in to reply to this topic.

There's a whole bunch of content on CSS-Tricks.

Search for Stuff   •   Browse the Archives

Get the Newsletter ... or get the RSS feed