Picture Size question for tarasdashkevych of appetite theme

  • Unknown's avatar
    goodhopesam · Member ·

    Hello Taras,
    I had a question about picture sizing, which I’ve been trying to research on forums.

    One person wrote to you:
    “So about the homepage and all the other pages. When you look on a desktop it looks great, but on tablet and phone the images do indeed not keep the original size.”

    You wrote back:
    – The background image in the header section uses a “cover” functionality (CSS3), meaning the browser automatically scales the image as large as possible and maintains image aspect ratio so the image does not get squished.

    The image “covers” the entire width and height of the container. When the image and container have different dimensions, the image is clipped either at the top and bottom edges, or the left and right edges.

    You can remove the “cover” functionality by using this custom CSS: https://premium-themes.forums.wordpress.com/topic/stretching-images-for-featured-slider?replies=4

    I tried taking off the cover function and it only made the problem worse.

    My question is:
    Can the “cover” functionality be tied just to the size of the “picture box” on a page and not the page itself? My problem is that whenever my page is expanded on a larger screen (particularly vertically, down) the picture blows up so that it is much more zoomed in than I’d like.

    Thank you very much

    The blog I need help with is: (visible only to logged in users)

  • Unknown's avatar
    thesacredpath · Member ·

    Hi, can you tell me which page, or verify you are talking about all pages you wish to change? We can use a media query to set the background-size to something different than cover for certain screen/window size ranges, but it may result in a bunch of whitespace beside or below/above the image. It could also be that I might have some suggestions on other ways to change things so that it is better for you.

  • Unknown's avatar
    goodhopesam · Member ·

    Thanks for responding, thesacredpath.

    The specific pages are those that I have mashed together (using the featured image slide show) to make a home page. However, many of the pictures on other pages distort too.

    https://wordpress.com/page/goodhopepca.com/29
    https://wordpress.com/page/goodhopepca.com/1853
    https://wordpress.com/page/goodhopepca.com/1849

    For instance: good /Users/samhettinger/Desktop/Screen Shot 2018-01-18 at 5.26.38 PM.png
    vs
    bad /Users/samhettinger/Desktop/Screen Shot 2018-01-18 at 5.07.18 PM.png

  • Unknown's avatar
    thesacredpath · Member ·

    The image links I cannot see since the links lead to your computer.

    Can you explain what you mean by “distort”? Typically when I think of a distorted image, I think of one where the width or height have been compressed or expanded and the other dimension has not. On the three images in your slideshow on the main page, I’m not seeing that sort of distortion when I compare them to the original images.

  • Unknown's avatar
    thesacredpath · Member ·

    Can you upload those screenshots to your media library and then I can have a look at them and you can delete them later after we get things figured out.

  • Unknown's avatar
    goodhopesam · Member ·

    Hello thesacredpath,
    Sorry I have not responded in so long- we had a crazy two weeks at work.

    Maybe a better word is “enlarge.” The pictures on my site enlarge with the size of the size of my internet browser’s open page – vertically as well as horizontally.

    Can the responsiveness of the picture be tied just to the size of the “picture box” area on a page and not the page itself? My problem is that whenever my page is expanded on a larger screen (particularly vertically, down) the picture enlarges so that it is much more zoomed in than I’d like.
    Thanks!

  • Unknown's avatar
    goodhopesam · Member ·

    And I uploaded the pics in my media library for you to look at.
    2 are “pics the right size” and 2 are enlarged along with the browser window

  • Unknown's avatar
    thesacredpath · Member ·

    Thanks for the uploads, and sorry for the tardiness of this reply. This got lost in my queue. This is going to be difficult, and I can’t promise that I can get it perfect, but I think I can improve on it, but the first thing I’ll need you to do is to create images for the slider at the top that are all exactly the same size by cropping and resizing since it looks to be impossible to adjust individual images based on the way that this particular slider works. If you can do that, and upload and set them and then let me know, I’ll see what I can do.

  • The topic ‘Picture Size question for tarasdashkevych of appetite theme’ is closed to new replies.