View Full Version : How do I use two background pictures?

09-25-2010, 11:43 PM
Hi all,
First off - you should know that I have little clue about web site creation, so please forgive my question that follows:

Check out this site: www.wilton.com (http://www.wilton.com)

It has a top purple bar that functions as a background (and goes to both sides of the browser, and is not limited to a certain width), and then there's another background - the colorful stripes.

I managed to implement the stripes by creating an image, and then repeating it. This is the code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Cakery - Cakes for everyone</title>

<style type="text/css">
body,td,th {
font-family: Arial, Tahoma, Verdana;

body {
background-image: url(Background.jpg);
background-repeat: repeat;


This shows the colorful stripes I created quite nicely. Problem is, I tried to copy the top purple bar - and I couldn't. It only worked when using a table, but then the width was limited to what I specified.
I think Wilton is using a css, but I have no clue how to do that.

I'd appreciate your help, especially helping me with the code.


09-27-2010, 01:24 AM
create a new div, then you can position that and give it its own background image.
welcome to the forum BTW

09-27-2010, 10:21 AM
Thanks, I'll give it a try.