Welcome • User Guide
ToS • Privacy • Canary
Donate • Bugs • License

©2024 Poal.co

855

/s/MeanwhileOnGLP (part of the image is hidden by the scrollbar (pic8.co))

.subbanner {
    display: grid;
    margin: auto;
    position: relative;
    width: 100vw !important;
    height: 10vw;
    background-size: 100% !important;
    background: url(%%banner%%) no-repeat center;
    background-position: top center;
}
  • This is the default template I use for all my banners.

/s/Jewspiracy (image fits but is too small (pic8.co))

.subbanner {
    display: grid;
    margin: 0px;
    margin-left: -0.5vw !important;
    position: relative;
    width: 100vw !important;
    height: 11vw;
    background-size: 96% !important;
    background: url(%%banner%%) no-repeat center;
    background-position: top center;
}
/s/MeanwhileOnGLP ([part of the image is hidden by the scrollbar](https://pic8.co/sh/4VxlMu.png)) ``` .subbanner { display: grid; margin: auto; position: relative; width: 100vw !important; height: 10vw; background-size: 100% !important; background: url(%%banner%%) no-repeat center; background-position: top center; } ``` - This is the default template I use for all my banners. /s/Jewspiracy ([image fits but is too small](https://pic8.co/sh/nxRd4T.png)) ``` .subbanner { display: grid; margin: 0px; margin-left: -0.5vw !important; position: relative; width: 100vw !important; height: 11vw; background-size: 96% !important; background: url(%%banner%%) no-repeat center; background-position: top center; } ```

(post is archived)

You are currently inside a comment thread.
Click here to see all the comments (13).
[–] • 1 pt (edited )

Hey. One thing I just tested on GPL that also looked ok for me on desktop:

  • leaving your height at 10vh
  • changing background-size to background-size: 100% 20vh !important;
  • changing your margin to margin: 0 8px 0 0 !important;

This allows the image to:

  • be 100% width and go behind the scrollbar
  • the margin of 8 pixels on the right shifts the background to the left 8px so the scrollbar doesn't overlap it
  • the height stretched vertically to fill the 10vh size of the banner element

Didn't check on mobile to see how it looks (might need some margin adjustment to match scrollbar width).