background image in section won't position to bottom

Hi there,

Not sure if I fully understand.

This is what I'm seeing:
https://www.screencast.com/t/79xa6QzZ

The background-position setting is definitely what you need to adjust to reposition it.

This is a good article:
https://css-tricks.com/almanac/properties/b/background-position/

Hi Leo,

Your screenshot is the correct section and image I'm struggling with- but did you notice it won't sit at the bottom unless the screen is stretched really wide? I have background position indicated with CSS - but whether I use 0% or the bottom keyword it still won't sit at the bottom (unless the screen is stretched really wide). Otherwise it floats right at the top edge. I have the bottom margin for that section at 0, but can't think what else must be interfering? So frustrating!

Hi there,

instead of:

background-size: 30%;

try:

background-size: contain;

Hi David,

Tried that but it enlarged the image on desktop, and still gave a gap on tablet and mobile. I have switched background-size to auto and also jet tried background-origin and background clip to no avail... something is up and I can't figure it out.

What if you turn off the parallax option and then set your background position to left bottom?

Yay, that worked, thanks! Before I close this topic, can you share the css for how to hide this background image element on tablet and mobile please?

You could try this:

@media (max-width: 1024px) {
   .rep.background {
        background-image: none;
    }
}

Let me know :)

Excellent, thanks again!

You're welcome :)