background not extending
Hi
I am trying the new layout at http://erp.des-us.com/. Please notice that the gradient background ends just in the middle of the bottom div. Please check the other 2 pages with content, http://erp.des-us.com/sitemap.php and http://erp.des-us.com/career.php.
My css code is:
and my html code is this:Code:/* if you remove this then the container disappears in IE */ * html #containerind {height: 100%; min-height:100%;} /* General */ * {margin:0;padding:0;} html, body {height:100%;} html {background: -moz-radial-gradient(center, #3399ff, #fff) no-repeat #BBDDFF; background: -webkit-gradient(radial, 50% 50%, 0, 50% 50%, 900, from(#3399ff), to(#fff)) no-repeat #BBDDFF; background:-o-radial-gradient(center, #3399ff, #fff);} body {font: 1em Verdana, Arial, Helvetica, sans-serif; color: #000;} #wrapper {min-height:100%;} /* index */ #containerind {width:85%; margin-left:auto; margin-right:auto; margin-top:5px; background-color:#FFF;border-radius: 15px; -moz-border-radius: 15px; -webkit-border-radius: 15px; position:relative; padding-bottom:30px;} /* footer */ #bottom {width:90%; margin-left:auto; margin-right:auto; background:#E7E7F3 no-repeat; border: thin solid #3399ff; border-radius: 45px 10px 45px 10px; -moz-border-radius: 45px 10px 45px 10px; -webkit-border-radius: 45px 10px 45px 10px; font: .55em Verdana, Geneva, sans-serif; position:relative; margin-top:-30px; padding:30px; height:30px; clear:both;} .copyrgt {float:left; width:50%;} .bottommenu {float:right;} .bottommenu li {display:inline; list-style-type:none; text-decoration:none; padding:0 5px; border-right: thin solid #666633; color:#666633;} .bottommenu li a:hover {text-decoration:underline;} .bottommenu li a:visited {text-decoration:none;} .bottommenu li a:hover,.bottommenu li a:visited { color:#6363B0;}
The css also has code for the top menu drop down, and some other styling for slideshows on various pages.HTML Code:<!DOCTYPE HTML> <html> <head> <meta charset="utf-8"> <title>D.zigns SiteMap</title> <!--[if !IE 7]> <style type="text/css"> #wrapper {display:table;height:100%} </style> <![endif]--> <?php require_once('top.php'); ?> </head> <body> <div id="wrapper"> <div id="container"> this has top menu items <div id="leftcont"> This section will have the sitemap of the website. this is left bigger column. <!-- end of #leftcont--></div> <div id="sidemenu"> this is the right smaller column. <!-- end of #sidemenu--></div> <!-- end of #container--></div> <!-- end #wrapper --></div> <div id="bottom"> this is the bottom or footer div <!-- end #bottom --></div> </body> </html>
Please help me extend the background to the whole page.
Thanks
Reply With Quote
Originally Posted by legend@12
Bookmarks