Image size help

  • Unknown's avatar

    Hi,
    I hope someone can help me .. I am with this site, in the home the image on the right I would like it to reach the edges, I don’t know how to do it .. any ideas? Thank you!

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

  • Hi –

    The theme in use is not designed to be set up with a full page header image. Rather, the theme is designed with 2 columns.

    Take a look at the instructions and demo here:

    https://wordpress.com/theme/aperitive
    https://aperitivedemo.wordpress.com/

    The best option would be to find a theme that displays the header image as desired. Take a look at the different options on wordpress.com/themes/

  • Unknown's avatar

    Hi,
    Thanks for answering lizkarkoski :), I think I expressed myself bad, what I’m looking for is to adjust the images in the right column, to use the total width of the column (without borders).

  • You mean the featured images on the blog page? Changing their width with CSS could make them look stretched out, especially on a large monitor, but here’s how if you must:

    .blog .featured-image img {
        display: block;
        width: 100%;
    }

    Specifying a wider width at Customize > CSS > Media width may help, too, though I haven’t tested that, so if you try it let me know how it goes :)

    Also, please note how the images look on individual pages:
    https://quest2moveapp.com/2018/10/27/prueba-blog-02/

    Is that your intent?

  • Unknown's avatar

    Hi supernova,
    It isn’t the featured images that I want to change… are the images that I insert inside the home page, which are being adjusted in the right column … what I would like is to be able to use the total width of the right column … the images inserted in the right column reach the edge, without margins….

  • Hi there,

    Do you mean the circular images? There isn’t really a good way to do this.

    To make those images wider, you would need to make the entire content area wider using something like this:

    /*
    make content area on front page wider
    */
    .home .site-content {
    	padding-left: 0px;
    	padding-right: 0px;
    }
    .home div#primary.content-area {
    	padding-right: 0px;
    }

    But if you add that you’ll see it also causes your text to go full-width, which doesn’t look very good. To have that text be narrower again will take about three times as much CSS to make sure it still looks good on all devices, and the moment you add new content to the home page you’ll need even more CSS to compensate for that content.

    And on very wide screens I cannot get the images full-width at all – it appears a maximum size for the images is set somewhere else that cannot be overridden with CSS.

    So this is not a change I would recommend.

  • The topic ‘Image size help’ is closed to new replies.