Hi, apologies if this is not the correct group.
Here is my problem. I have two background images I would like to
display next to each other, the second one repeating for the entire
browser window width. The first
image "1.bmp" contains a graphic. The second image "2.bmp" is just the
background of "1.bmp" that I would like to carry on to the right
margin. The second image "2.bmp" is the same height as "1.bmp" but it
is very narrow. So in the browser the images would be displayed
"122222222222222222" with "2", which is "2.bmp", repeating to the right
hand margin.
This is what I have working so far/the html code.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="content-type" content="text/html;
charset=iso-8859-1" />
<style type="text/css" media="screen">
body
{
background: white url("2.bmp");
background-repeat: repeat-x;
}
</style>
</head>
<body>
test<br/>test<br/>test<br/>test<br/>test<br/>test
</body>
</html>
"2.bmp" repeats over and over for the entire line in the browser window
which is what I want. I can't find out how to put in "1.bmp" at the
left hand side though? I think I could do this by putting "1.bmp" in a
table column and putting a very wide "2.bmp" in another column. But
this feels cowboy, my code will be reviewed, and I want to do it
correctly anyway. I would appreciate some help if you can.
Thank you
Peter