May 2, 200917 yr Hi, sorry yet another question inbound This section of code wont put the background black any ideas why? #blog { width:476px; height:150px; margin: 0; background:black; color:black; border-left:1px solid; } Thanks
May 2, 200917 yr background: should be background-color: Background is the short hand to combine all properties, if you want to use it you need to define the other background properties too.
May 2, 200917 yr what's the relevant html? Try changing black to #000 Also make sure when you refresh your page, you refresh the cache too (ctrl+r or ctrl+shift+r). If they don't work, check if there is there anything overwriting it? Try background-color:#000 !important;
May 2, 200917 yr If you use the shorthand 'background' property, you don't need to specify all of the background properties. If you don't specify one of the properties, the default values will be used instead. In your case, the fact that it isn't changing colour probably means it's being overridden by another rule in your stylesheet. Can you post all of your html/css?
May 2, 200917 yr Author Sure body { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px; color:white; } #wrapper { width:955px; height:0 auto; } #header { width:955px; background:black; color:white; } #header2 { width: 472px; height: 42px; float:left; background:black; margin: 0; color:white; padding-left:5px; } #nav { width: 476px; height: 0 auto; float: right; margin: 0; background:black; color:white; border-left:1px; } #nav li, #nav li a { display:inline; list-style-type:none; padding:10px; font-size:15px; color:white; text-decoration:none; } #nav a:hover { border-bottom:5px solid white; padding-bottom:3px; color:white; } #content { width:467px; height: 337px; float:left; background:black; margin-bottom: 5px; color:white; padding-top:5px; padding-left:5px; padding-right:5px; border-top:1px solid; border-bottom:1px solid; } #recent { width: 466px; height: 325px; float: right; margin: 0; background:black; color:white; border-left:1px; padding-left:5px; padding-top:17px; padding-right:5px; border-top:1px solid; } #blog { width:476px; height:150px; margin: 0; background-color:black; color:white; border-left:1px solid; }
May 2, 200917 yr If you want the entire page to have a black background, you need to put the background-color: black; bit in the body section.
May 3, 200917 yr This probably won't fix it, but you've got two instances where you've used height: 0 auto; Just remove that all together, that way your css is error free, and that rules out one remote possibility. I can't see why it wouldn't work, unless your overwriting it (which i can't see why!?). Got the html to go with it? or even better a live link?
May 3, 200917 yr Author Ive sorted out the background issue but it wont go left now! html is <!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" xml:lang="en" lang="en"> <head> <script type="text/javascript" src="js/prototype.js"></script> <script type="text/javascript" src="js/scriptaculous.js?load=effects,builder"></script> <script type="text/javascript" src="js/lightbox.js"></script> <link rel="stylesheet" href="css/lightbox.css" type="text/css" media="screen" /> <title>Stewart Gliniecki Photography</title> <link rel="stylesheet" href="main.css" type="text/css" /> </head> <body> <div id="wrapper"> <div id="header"> <img src="header.jpg" width="955" height="200" alt="header" /> </div> <div id="nav"> <ul> <li><a href="PowerPoint.html" title="boo">home</a></li> <li><a href="PowerPoint.html" title="boo">About</a></li> <li><a href="PowerPoint.html" title="boo">Pictures</a></li> <li><a href="PowerPoint.html" title="boo">Contact</a></li> </ul> </div> <div id="header2"> <h2>Home</h2> </div> <div id="content"> Hello and welcome to my photography website. I product print and stock photos for sale for you. My photos range from adventure sports too wildlife and only the best make it too this website. <h5>Picture genre</h5> <ul> <li>here</li> <li>here</li> <li>here</li> <li>here</li> <li>here</li> </ul> You can purchase my pictures ethier as a stock picture in a varrious sizes of sites such as istock or you can purchas prints of the item off ebay. <h5>Purchase</h5> <ul> <li>here</li> <li>here</li> <li>here</li> </ul> <br/> Please take some time too look at my pictures </div> <div id="recent"> <br/><br/><center><a href="imgsoon1.jpg" rel="lightbox"><img src="imgsoon.jpg" /></a></center> <br/><br/><br/><center><a href="imgsoon1.jpg" rel="lightbox"><img src="imgsoon.jpg" /></a></center> <div id="blog"> random ranrandom random andom random andom random random random andom random andom random random random andom random andom randomrandom random andom random andom random random random andom random andom random random random andom random andom randomrandom random andom random andom random random random andom random andom random random random andom random andom randomdom andom random andom random random random andom random andom random random random andom random andom random </div> </div> </body> </html> Css body { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px; } #wrapper { width:955px; } #header { width:955px; background-color:black; color:white; } #header2 { width: 472px; height: 42px; float:left; background-color:black; margin: 0; color:white; padding-left:5px; } #nav { width: 476px; float: right; margin: 0; background-color:black; color:white; border-left:1px; } #nav li, #nav li a { display:inline; list-style-type:none; padding:10px; font-size:15px; color:white; text-decoration:none; } #nav a:hover { border-bottom:5px solid white; padding-bottom:3px; color:white; } #content { width:467px; height: 337px; float:left; background-color:black; margin-bottom: 5px; color:white; padding-top:5px; padding-left:5px; padding-right:5px; border-top:1px solid; border-bottom:1px solid; } #recent { width: 466px; height: 325px; float: right; margin: 0; background-color:black; color:white; border-left:1px; padding-left:5px; padding-top:17px; padding-right:5px; border-top:1px solid; } #blog { width:476px; height:150px; margin: 0; background-color:black; color:white; border-left:1px solid; float:left; } Hope you can help
Create an account or sign in to comment