How to: CSS large background

Grafica

Since I posted the huge collection of Large Background Websites, I received several email requests on how to make a large background site with CSS. So, I thought it would be a good idea to share my techniques on designing large background websites. In this tutorial, I will provide various CSS examples on how you can create a large background site using either a single or double images.

Common Mistake: Background Gets Cropped

(see demo)
Take a look at the demo file, it looks fine under 1280px. But if you have a high resolution display, you will see the background gets cut off on the sides.

Example #1: Single Image

A quick solution to fix the problem mentioned earlier: make the edge of the image the same color as the BODY background color. Here, I’m going to use Web Designer Wall as an example. Take a look at the image below and notice the edge is a solid color?

Vai al sito

Leave a Reply

Powered by WordPress | Theme by chira | Thanks to Emilio GrazziEntries RSS Comments RSS