I have a small image, let's say 5X5, that I want to place in a DIV and I want to multiply that image vertically, till the end of the content of the page (or specific length). I'm not talking about making a background that multiplies a small image horizontally and vertically everywhere. I want the image multiplied only vertically, placed in a DIV that I can move around. Thanks.
-jmsYou'd have to set the image as a background of the div itself, which can stretch the full width of the page...
But in your styles for the div, add this:
background-repeat: repeat-x;
Example:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>My Special Div</title>
<style type="text/css">
#bgspan{
background-image: url(blahness.gif);
background-repeat: repeat-x;
height:40px;
width:100%
}
</style>
</head>
<body>
<div id="bgspan">
</div>
<div>
Other Content
</div>
</body>
</html>
With that, the "blahness.gif" image will repeat horizontally only. You have to keep the height of the div equal to the height of the image; otherwise part of the image will be cut off..
You could also nest the two main divs inside another larger div to keep their widths equal, if they're not at 100%..
-jmsYou'd have to set the image as a background of the div itself, which can stretch the full width of the page...
But in your styles for the div, add this:
background-repeat: repeat-x;
Example:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>My Special Div</title>
<style type="text/css">
#bgspan{
background-image: url(blahness.gif);
background-repeat: repeat-x;
height:40px;
width:100%
}
</style>
</head>
<body>
<div id="bgspan">
</div>
<div>
Other Content
</div>
</body>
</html>
With that, the "blahness.gif" image will repeat horizontally only. You have to keep the height of the div equal to the height of the image; otherwise part of the image will be cut off..
You could also nest the two main divs inside another larger div to keep their widths equal, if they're not at 100%..