WordPress.org

Ready to get started?Download WordPress

Forums

Images are larger than max width (10 posts)

  1. missdelish
    Member
    Posted 2 years ago #

    I hope someone can help me! I recently moved over from wordpress.com and when I imported all my content, the photos in my posts were overlapping with the right sidebar. I did some searching and found that I had to Go into settings> media> and then set the max width and height. I did this and set the max width to 500 but the photos are showing at 640 width. I found some posts about editing the css or the functions.php and I tried both routes and neither worked.

  2. Good Guy
    Member
    Posted 2 years ago #

    Please post a link for us to see the problem on our system.

  3. missdelish
    Member
    Posted 2 years ago #

  4. Denis Leblanc
    Member
    Posted 2 years ago #

    Try adding this to your css file:

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

    It should resize your images to a max width of it's container and scale the height proportionally.

  5. Good Guy
    Member
    Posted 2 years ago #

    I suggest try to put this code at the end of your in your css file and save it.

    img {
    	max-width: 940px;
    }

    go back to your browser and reload or refresh the page and see if it worked. You can change the size downwards gradually to fit your column width. I guess 935px would be ideal to allow for padding, border and margin.

  6. missdelish
    Member
    Posted 2 years ago #

    Denis Leblanc! You are my hero. That worked like a charm. Thank you so much for the help :)

  7. Denis Leblanc
    Member
    Posted 2 years ago #

    Awesome, glad I could help.

  8. threesongbirds
    Member
    Posted 2 years ago #

    I hope you don't mind me "hijacking" this -so to speak.

    I'm having a similar issue with the AutoFocus theme. In the single posts pages, the images that I have linked from third parties are not following the max-width.
    Example: http://threesongbirds.coloursplash.org/?p=44

    In the CSS I have:

    .single #container {
    float: left;
    width: 800px;
    max-width: 800px;
    position: relative;
    margin-bottom: 3em;
    overflow:visible;
    }

    (Have tried adding the max-width: 100% and max-height: auto also)
    In the post HTML, I have tried to include styles in with the img tag, but nothing...

  9. Denis Leblanc
    Member
    Posted 2 years ago #

    Try adding this to your CSS file:

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

  10. threesongbirds
    Member
    Posted 2 years ago #

    Awesome! Thanks so much!

Topic Closed

This topic has been closed to new replies.

About this Topic