Terms of Use/Privacy Policy - About - Contact - Search!
This technique may look like it works, it has however come to my attention that it dosn't work intirely as intended. Mainly when the browser window is resized, or the content expands beyond a certain height. In some cases it might be preffered to have a background scratch, so i will continiue to search for a working technique.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<title>My first Website</title>
<style type="text/css">
body {
margin:0;
padding:0;
}
#Basement {
position: relative;
width: 100%;
}
#BodyContent {
position: absolute;
top: 0;
right: 0;
}
</style>
</head>
<body>
<div id="Basement">
<div class="BodyContent">
<h1>Scratching Background Example</h1>
<p>Text on Scratching Background</p>
</div>
<img src="Untitled.gif" alt="Scratching background-image" style="width:100%; min-height:100%; position:absolute; top:0; left:0; z-index:-1;">
</div>
</body>
</html>