i have a problem...a divs background doesnt repeat-y with the height of the div ...it works with ie
please help me
html -----------------------------------------------------------------------------
<!DOCTYPE HTML PUBLIC \"-//W3C//DTD HTML 4.01//EN\" \"http://www.w3.org/TR/html4/strict.dtd\"> <html> <head> <meta http-equiv=\"Content-Type\" content=\"text/html; charset=iso-8859-1\"> <title>Welcome to Rotary Tourism::::...</title> <link rel=\"stylesheet\" href=\"pleasant/pleasant.css\" type=\"text/css\"> </head> <body> <div id=\"wrapper\"> <div id=\"header\"> <ul id=\"topmenu\"> <li><a href=\"#\" class=\"contact\"></a></li> <li><a href=\"#\" class=\"home\"></a></li> </ul> <div id=\"mainmenu\"> <div id=\"top\"></div> <div id=\"middle\"> <ul id=\"mainmenu\"> <li><a href=\"#\">history<span class=\"\"></span></a></li> <li><a href=\"#\">culture<span class=\"\"></span></a></li> <li><a href=\"#\">tourism<span class=\"\"></span></a></li> <li><a href=\"#\">geography<span class=\"\"></span></a></li> <li><a href=\"#\">medical<span class=\"\"></span></a></li> <li><a href=\"#\">ad me<span class=\"\"></span></a></li> </ul><div class=\"clear\"></div> </div> </div> <div id=\"headerimage\"></div> </div> <div id=\"maincontent\"> <div id=\"leftbox\"> <div id=\"contentpiece\"> <div id=\"peacockheader\"> <h1>Welcome to Rotary Tour</h1> <div id=\"peacock\"></div><div class=\"clear\"></div> </div> <p> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque metus erat, sagittis at aliquam vel, vestibulum ut mi. Nullam ultricies metus sit amet urna elementum id pharetra mi ultricies. Suspendisse ut sem nibh. Integer sit amet massa ante. Etiam dignissim arcu id est tincidunt et varius dui semper. Nam purus mauris, malesuada vel elementum sed, congue id lacus. Quisque hendrerit tempus tellus a porta. In hac habitasse platea dictumst. Maecenas ut aliquet enim. Cras fermentum lectus ac est facilisis hendrerit. Phasellus at urna at lectus semper volutpat. Morbi at ligula leo. Curabitur sodales leo tortor. Cras risus nunc, commodo eu tincidunt in, viverra ac felis. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Praesent ultricies accumsan sodales. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Nullam justo libero, convallis feugiat consectetur vel, rutrum nec lacus. </p> <div id=\"more\">read more</div>
</div> <div id=\"contentpiece\"> <div id=\"peacockheader\"> <h1>Welcome to Rotary Tour</h1> <div id=\"peacock\"></div><div class=\"clear\"></div> </div> <p> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque metus erat, sagittis at aliquam vel, vestibulum ut mi. Nullam ultricies metus sit amet urna elementum id pharetra mi ultricies. Suspendisse ut sem nibh. Integer sit amet massa ante. Etiam dignissim arcu id est tincidunt et varius dui semper. Nam purus mauris, malesuada vel elementum sed, congue id lacus. Quisque hendrerit tempus tellus a porta. In hac habitasse platea dictumst. Maecenas ut aliquet enim. Cras fermentum lectus ac est facilisis hendrerit. Phasellus at urna at lectus semper volutpat. Morbi at ligula leo. Curabitur sodales leo tortor. Cras risus nunc, commodo eu tincidunt in, viverra ac felis. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Praesent ultricies accumsan sodales. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Nullam justo libero, convallis feugiat consectetur vel, rutrum nec lacus. </p> <div id=\"more\">read more</div>
</div> </div> <div id=\"rightbox\"> hi how are you </div> </div> </div> </body> </html>
i have a problem...a divs background doesnt repeat-y with the height of the div ...it works with ie
please help me
html
-----------------------------------------------------------------------------
css
-------------------------------------------------------------------------------------------------
*{margin:0px;padding:0px;}
div#contentpiece p
{
text-align:justify;
padding:10px;
margin-bottom:10px;
}
div#more
{
color:#FFCC33;
float:right;
background:url(images/peeli.jpg) no-repeat left top;
height:28px;
padding-top:12px;
}
div#peacock
{
background-image:url(images/header_peacock.jpg);
background-position:right top;
width:72px;
height:68px;
float:left;
}
h1
{
color:#ff9900;
padding:5px;
font-family:Trebuchet MS,Georgia;
text-align:left;
display:inline-block;
float:left;
}
div#peacockheader
{
height:90px;
}
div#rightbox
{
width:30%;
height:auto;
float:right;
margin-top:28px;
background-color:#0d0d0d;
margin-right:8px;
}
div#leftbox
{
width:60%;
height:auto;
float:left;
margin-top:26px;
background-color:#0d0d0d;
margin-left:18px;
}
div#maincontent
{
background:url(images/spark.jpg) #0d0d0d right top repeat-y;
/*border:#FFFFFF 2px solid;*/
width:100%;
height:auto;
}
.clear
{
clear:left;
}
div#headerimage
{
background:url(images/headimage.jpg) no-repeat left;
height:350px;
width:730px;
float:right;
margin-top:-350px;
/*margin-right:37px;*/
}
ul#mainmenu
{
margin-left:55px;
}
ul#mainmenu li
{
padding:5px;
list-style:none;
}
ul#mainmenu li a
{
text-decoration:none;
color:#000000;
font-weight:bold;
font-family:Arial, Helvetica, sans-serif;
}
ul#mainmenu li a:hover
{
background-image:url(images/suna.jpg);
background-position:left;
background-repeat:no-repeat;
padding-left:20px;
color:#0066FF;
}
div#mainmenu
{
width:226px;
}
div#mainmenu #top
{
background:url(images/main_menu_top.jpg) no-repeat;
width:226px;
height:158px;
}
div#mainmenu #middle
{
background:url(images/main_menu_middle.jpg) no-repeat;
width:226px;
height:244px;
}
.yellow
{
height:3px;
display:block;
width:auto;
background:#99FF33;
}
.blue
{
height:3px;
display:block;
width:auto;
background:#0066FF;
}
.contact
{
background:url(images/contacticon.jpg);
height:49px;
width:48px;
display:inline-block;
clear:both;
}
.home
{
background:url(images/homeicon.jpg) no-repeat center;
height:49px;
width:49px;
display:inline-block;
clear:both;
}
ul#topmenu
{
}
ul#topmenu li
{
display:inline-block;
list-style:none;
padding:3px;
width:49px;
height:49px;
float:right;
}
ul#topmenu li a
{
}
div#wrapper
{
margin:0 auto;
width:956px;
/*border:#33FF99 solid 2px;*/
text-align:left;
background-color:#0d0d0d;
}
body {
font-family: Georgia,Arial, Helvetica, sans-serif;
background:#000000 url(images/yellow_back.png) repeat-x;
color:#FFFFFF;
}
---------------------------------------------------------------
someone please help me out ...
Regards
Nidhin
div#maincontent {background:#0D0D0D url(images/spark.jpg) repeat-y scroll right top;
height:auto;
overflow:hidden;
width:100%;
}