Jump to content


Repeat.


2 replies to this topic

#1 iwz

    Young Padawan

  • Members
  • Pip
  • 174 posts
  • Gender:Male
  • Location:UK
  • Interests:Photography, Gaming, Web-design.

Posted 22 March 2008 - 09:01 AM

Hmmm, i'm trying to get my website header go across my entire page.

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.

Posted Image (headergrad.jpg)

Posted Image (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.


#2 tjl30

    Young Padawan

  • Members
  • Pip
  • 67 posts
  • Gender:Male
  • Location:MA
  • Interests:Graphic Design, Website layouts, Website scripting, movie editing, animation, snowboarding, sculpture, and drawing.

Posted 22 March 2008 - 02:23 PM

Your CSS shorthand is not correct, silly little mistake.

background: #242424 url('layout/headergrad.jpg') repeat: x bottom;

to

background: #242424 url('headergrad.jpg') repeat-x bottom;

In shorthand you can't have more than one : or else things don't work right.

#3 iwz

    Young Padawan

  • Members
  • Pip
  • 174 posts
  • Gender:Male
  • Location:UK
  • Interests:Photography, Gaming, Web-design.

Posted 22 March 2008 - 04:09 PM

Ah, thanks.





1 user(s) are reading this topic

0 members, 1 guests, 0 anonymous users