I'm using a css technique of repeating the background across the page, then placing the logo with a 20% indent in the div.
Here's the images.
(headergrad.jpg)
(header.jpg)Here's the html on index.php
<!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"> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <link rel="stylesheet" type="text/css" href="style.css" /> <title>Iwz's Portfolio</title> </head> <body> <div id="container"> <div id="header"> <img src="layout/header.jpg"> </div> </div> </body> </html>
And here's the style: (style.css)
body {
margin: 0;
padding: 0;
text-align: center;
background: #242424;
}
#container {
margin: 0 auto 0 auto;
text-align: left;
}
#header {
height: 95px;
width: 80%;
padding-left: 20%;
background: #242424 url('layout/headergrad.jpg') repeat: x bottom;
}
The logo is showing, but the gradient behind isnt. Any suggestions?
Edited by iwz, 22 March 2008 - 09:21 AM.
