Hey Im trying to get an image to show up and repeat behind both of my footer and menu bars, this way I can add a gradient... the website is: Http://www.pathologyresouce.com and the CSS is: /* null margins and padding to give good cross-browser baseline */ html,body,address,blockquote,div, form,fieldset,caption, h1,h2,h3,h4,h5,h6, hr,ul,li,ol,ul, table,tr,td,th,p,img { margin:0; padding:0; } img,fieldset { border:none; } hr { display:none; /* I use hr just for CSS off dividers */ } p { padding:0.5em 1em; } a:visited { color:#93a8c9; } a:active, a:focus, a:hover { color:#93a8c9; } /* Text styling */ .centro { text-align: center; } .content h2 { text-align:center; } .content h3 { text-align:center; } .content p { text-align:left; } .bList { list-style:circle; text-align:left; } .bList li { display:block padding:0 32px; } body { padding:50px 8px; text-align:center; /* center #pageWrapper in IE 5.x */ font:normal 85%/130% arial,helvetica,sans-serif; background:#F2F2F2; } #pageWrapper { position:relative; /* make sure IE re-renders this element on resize */ zoom:1; /* trip haslayout */ min-width:752px; max-width:1104px; margin:0 auto; padding:1px; background:#F2F2F2; border:1px solid #000; text-align:left; } * html #pageWrapper { /* IE has no min/max width, but we can fake it with an expression. First we set a fixed width as a lowest common denominator for when jscript is disabled, then we run the expression to overload it if jscript is present. */ width:752px; width:expression( (document.body.clientWidth>1024) ? "1104px" : ((document.body.clientWidth>800) ? "auto" : "742px") ); } h1 { position:relative; zoom:1; /* trip haslayout */ padding:10px 20px; font:bold 44px/44px "times new roman",times,serif; color:#FFF; background:#93A8C9; } h1 small { display:block; font:bold 24px/24px "times new roman",times,serif; } /* to recap: 44px line-height on h1, plus 24px on h1 small, plus 20px padding == 88px, equal to our replacement image */ h1 span { position:absolute; top:0; left:8px; width:480px; height:88px; background:url(http://www.pathologyresource.com/images/h1Logo.png) 0 0 no-repeat; } h2 { padding:4px 4px; text-decoration:none; font:bold 16px/18px arial,helvetica,sans-serif; } #topSearch { position:absolute; top:15px; /* how far down from the top of #pageWrapper should it be? */ right:10px; /* how far in from the right edge of #pageWrapper should it be? */ } #az { list-style:none; text-align:center; } #az li { display:inline; } #az a { display:-moz-inline-block; display:-moz-inline-box; display:inline-block; padding:4px 4px; text-decoration:none; font:bold 16px/18px arial,helvetica,sans-serif; color:#125; background:#FFF; } #az a:active, #az a:focus, #az a:hover { color:#93a8c9; } #mainMenu { list-style:none; text-align:center; overflow: hidden; width: 100%; font: bold; background:#125 } #mainMenu ul { background:#125 url(http://www.pathologyresource.com/images/mainMenu.png) 0 0 repeat-x; } #mainMenu li { display:inline; } #mainMenu a { display:-moz-inline-block; display:-moz-inline-box; display:inline-block; padding:4px 16px; text-decoration:none; font:bold 16px/18px arial,helvetica,sans-serif; color:#FFF; background:#125; } #mainMenu a:active, #mainMenu a:focus, #mainMenu a:hover { color:#125; background:#FFF; } #fauxColumns { overflow:hidden; /* wrap floats */ position:relative; /*fixes disappearing sidebar in IE7*/ width:100%; /* trip haslayout, wrap floats in IE */ /*padding-bottom:8px; adds space between the footer and the body so you can see sideBar color underneath */ background:#ffdddd url(http://www.pathologyresource.com/images/fauxColumns.png) top right repeat-y; } #fauxColumns p { padding:0 1em 1em; } #contentWrapper { float:right; width:100%; } #content { margin-left:200px; padding-top:1em; background:#FFF } #sideBar { position:relative; /* make sure it depth sorts over #contentWrapper */ float:right; width:192px; margin-right:-192px; padding-top:1em; /* negative margin equal to it's width makes the element zero width for the purposes calculating floats and other 'flow' elements. Zero width can fit next to 100% width - sneaky trick to make a fluid layout with a fixed column while keeping the content before the sidebar */ } #sideBar h2 { padding: 0.4em 0.8em; font:bold 100%/120% arial,helvetica,sans-serif; } #footer { clear:both; /* should be unneccessary, but just in case */ text-align:center; padding-bottom:0.4em; color:#FFF; background:#125 url(http://www.pathologyresource.com/images/footerBar.png) 0 0 repeat-x; } #footer ul { list-style:none; text-align:center; width:100%; /* trip haslayout */ padding:4px 0; margin-bottom:0.4em; background:#93A8C9; } #footer li { display:inline; } #footer ul a { display:-moz-inline-block; display:-moz-inline-box; display:inline-block; padding:2px 0.4em 2px 0.8em; margin-right:0.4em; color:#FFF; border-left:1px solid #FFF; } #footer ul .first a { border:none; } #footer ul a:active, #footer ul a:focus, #footer ul a:hover { color:#125; } #footer a { color:#fff; } #footer a:hover { color:#93a8c9; } Code (markup): HTML/PHP <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en" ><head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <link type="text/css" rel="stylesheet" href="screen.css" media="screen,projection,tv" /> <!-- Don't forget to implement these later! <link type="text/css" rel="stylesheet" href="print.css" media="print" /> <link type="text/css" rel="stylesheet" href="handheld.css" media="handheld (ie: cellphones)" /> --> <title> Pathology Resource - A-Z Comprehensive Learning Directory </title> </head><body> <!-- empty tags like SPAN and B below are image sandbags for sliding doors or glider-levin replacement - do not remove!!! Horizontal rules and .jumpto menus should be removed by CSS and are present for CSS off users only. --> <div id="pageWrapper"> <h1> Pathology Resource<br /> <small>A-Z Comprehensive Learning Directory</small> <span></span> </h1><hr /> <!--Search Bar --> <form id="topSearch"><input type="text" name="#" id="#" size="20px"> <input name="submit" type="submit" value="Search"> </form> <!--End Search Bar --> <!--Menu --> <ul id="mainMenu"> <li><a href="Http://www.PathologyResource.com">Home</a></li> <li><a href="Http://www.PathologyResource.com/about">About</a></li> <li><a href="Http://www.PathologyResource.com/resources">Resources</a></li> <li><a href="Http://www.PathologyResource.com/research">Research</a></li> <li><a href="Http://www.PathologyResource.com/news">News</a></li> </ul><hr /> <!--end Menu--> <div id="fauxColumns"> <div id="contentWrapper"><div id="content"> <?php include("menu.php");?> <p>Welcome to Pathology Resource! Here you can learn about various Pathologies, The etiology relating to the conditions, as well as keep up to date on the most recent and pertinent news and research. Thanks for visiting!! Welcome to Pathology Resource! Here you can learn about various Pathologies, The etiology relating to the conditions, as well as keep up to date on the most recent and pertinent news and research. Thanks for visiting!!Welcome to Pathology Resource! Here you can learn about various Pathologies, The etiology relating to the conditions, as well as keep up to date on the most recent and pertinent news and research. Thanks for visiting!!Welcome to Pathology Resource! Here you can learn about various Pathologies, The etiology relating to the conditions, as well as keep up to date on the most recent and pertinent news and research. Thanks for visiting!!Welcome to Pathology Resource! Here you can learn about various Pathologies, The etiology relating to the conditions, as well as keep up to date on the most recent and pertinent news and research. Thanks for visiting!!Welcome to Pathology Resource! Here you can learn about various Pathologies, The etiology relating to the conditions, as well as keep up to date on the most recent and pertinent news and research. Thanks for visiting!!Welcome to Pathology Resource! Here you can learn about various Pathologies, The etiology relating to the conditions, as well as keep up to date on the most recent and pertinent news and research. Thanks for visiting!!Welcome to Pathology Resource! Here you can learn about various Pathologies, The etiology relating to the conditions, as well as keep up to date on the most recent and pertinent news and research. Thanks for visiting!!Welcome to Pathology Resource! Here you can learn about various Pathologies, The etiology relating to the conditions, as well as keep up to date on the most recent and pertinent news and research. Thanks for visiting!!Welcome to Pathology Resource! Here you can learn about various Pathologies, The etiology relating to the conditions, as well as keep up to date on the most recent and pertinent news and research. Thanks for visiting!!Welcome to Pathology Resource! Here you can learn about various Pathologies, The etiology relating to the conditions, as well as keep up to date on the most recent and pertinent news and research. Thanks for visiting!!Welcome to Pathology Resource! Here you can learn about various Pathologies, The etiology relating to the conditions, as well as keep up to date on the most recent and pertinent news and research. Thanks for visiting!!Welcome to Pathology Resource! Here you can learn about various Pathologies, The etiology relating to the conditions, as well as keep up to date on the most recent and pertinent news and research. Thanks for visiting!!</p> <br /> <br /> <!-- #content, #contentWrapper --></div></div> <div id="sideBar"><hr /> <h2>Sidebar Content</h2> <!-- smaller text underneath the headings, make these h2,h3,h4?? Define in CSS sheet?--> <br /> <br /> <br /> <p></p> <br /> <br /> <br /> <!-- #sideBar --></div> <!-- #fauxColumns --></div> <!--Footer--> <div id="footer"><hr /> <?php include("footer.php");?> <!-- #footer --></div> <!-- #pageWrapper --></div> </body></html> Code (markup): Please help!
What browser are you using?? Also it may have been that I was updating it at the time you checked it.... I think I fixed it though, in front of the classes when it had background: #### url( etc...) I took the color values out and then just left the images , so not sure how that will work for ppl when they have images off?
Ian, Your typo. you wrote: http://www.pathologyresouce.com/ instead of - http://www.pathologyresource.com/
I can see your images like: http://www.pathologyresource.com/images/h1Logo.png What images are NOT showing up?