• Resolved sterndesign

    (@sterndesign)


    Hi Guys,

    I’m trying to duplicate a page on the wordpress.com website for a how-to video. I can’t seem to get the background image in the hero section to be the right size. I’ve tried “cover”, “contain” and various “positions” but the image is ether too large (when using “cover”) or too small (when using “contain” and “center right”

    Here is a link to how it should look: https://wordpress.com/create-website/ and I’ve linked to my site above.

    I feel like I’m missing something obvious.

    Any ideas?

    Thanks kindly,

    Matt

    The page I need help with: [log in to see the link]

Viewing 1 replies (of 1 total)
  • Elvin

    (@ejcabquina)

    Hi there,

    Set the background to “contain” and position to “bottom right”.

    You then change the padding of the container block to 20rem top and bottom.

    That’s the closest setting to your reference.

    It will only differ a little because the rem value of your site differs from the rem value of the reference site.

    If you add this CSS:

    html {
        font-size: 62.5%;
    }

    The rem value of your site will be equal to the reference. This should make the size close if not identical to the reference site.

Viewing 1 replies (of 1 total)

The topic ‘Container Background Image Help’ is closed to new replies.