Fri, 2010-08-13 19:41
I'm trying to use a background image at the top of my page and fill the rest of the background with color, but I'm having a hard time getting it to work. When I added the image code on my stylesheet the background color disappears. How can I use both?
html:
<!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" /> <title>Left Navigation Website</title> <link href="style.css" rel="stylesheet" type="text/css"> </head> <body> <div id="header"> </div> <div id="wrapper"> <div id="navigation"> </div> <div id="content"> </div> </div> <div id="footer"> </div> </body> </html>
stylesheet:
body { width:800px; margin:0 auto; margin-top:0px; background-color:#777000; background:url(bg.gif) repeat-x; } #header { width:800px; height:120px; background-color:#777000; background:url(header.gif); } #wrapper{ width:800px; background:url(background_3.gif) repeat-y; overflow:auto; margin-top:0px; } #navigation { width:200px; min-height:200px; /* for modern browsers */ height:auto !important; /* for modern browsers */ height:200px; /* for IE5.x and IE6 */ background-color:#bbb555; float:left; } #content { margin-left:220px; width:580px; min-height:200px; /* for modern browsers */ height:auto !important; /* for modern browsers */ height:200px; /* for IE5.x and IE6 */ background-color:#ffffff; margin-top:0px; } #footer { margin-top:0px; width:800px; height:100px; background-color:#777000; }
Fri, 2010-08-13 20:23
#1
try this background:#777000
try this
background:#777000 url(bg.gif) repeat-x;
First basic few steps in building a webpage
1. Gather and collect content.
2. Organize the content into meaningful semantic valid HTML
3. Design the prototype
4. Style using CSS
Fri, 2010-08-13 20:26
#2
Works like a charm... thanks!
Works like a charm... thanks!