Background image

From Gamepedia Help Wiki
Jump to: navigation, search

The main background image for a wiki should scale to whatever size the user screen is. That said, what do you do if your own monitor/graphics card is not that great? Here are a few tips:

You can use the Ctrl key along with the - key to shrink the image on your screen, repeatedly if necessary. This will give you a very good idea of whether or not your choice of CSS for the background image actually scales, or if it results in an image that is abruptly cut off for users who have better monitors / resolution. (Ctrl and 0 resets it)

CSS tips[edit | edit source]

Cover[edit | edit source]

body {
    background: #000000 url(https://killingfloor2.gamepedia.com/media/9/98/Bg.jpg) no-repeat fixed center top;
    background-size: cover;
}

Scaling to width[edit | edit source]

If your background image fades nicely to transparent or the default background color, you can simply have it scale to width (or height).

body {
    background: #000000 url(https://witcher.gamepedia.com/media/3/33/Tw3_wiki_bg.jpg) no-repeat fixed center top / 100% auto;
}

Exceptional circumstances[edit | edit source]

If, for some reason, your background image cannot be scaled, then it should fade to either transparent or the default background color at (minimally) the right, left and bottom borders (assuming that you place it at the top of the page). This at least provides for a graceful transition on larger monitors.