background repeat of the left cotainer based on middle container

Forum Moderators: not2easy

Message Too Old, No Replies

background repeat of the left cotainer based on middle container

background repeat horizontal is not working

ravi

12:26 pm on Mar 4, 2010 (gmt 0)

Hi,

The background-repeat property of the left container is not getting repeating While the main container height is growing.

If i set the height to the left container means it is getting enlarged.

I would like to enlargement of the left container based on the middle container.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<HTML>
 <HEAD>  
  <STYLE type="text/css" media="screen"> 
   /** Side Container which is not getting repeating
    * While the main container height is growing..
    */  
   #sidebar {    
    width: 10em;
    height: auto;
background:#FF0000 repeat-y;
float:left;
clear:both;
border:2px solid #ff00ff;
   }
   /**Main Container*/
   #main { 
    width: auto;
    height: auto;       
   float:left;
  border:2px solid #ff00ff;
   } 
  </STYLE>
 </HEAD>
<BODY>  
  <DIV id="sidebar">Sided ... </DIV>
 <DIV id="main"> 
 <p>TEST TEST TEST TEST</p>
 <p>TEST TEST TEST TEST</p>
 <p>TEST TEST TEST TEST</p>   
 </DIV>  
</BODY>
</HTML>

kindly help me to fix this issue

webeno

10:02 pm on Apr 21, 2010 (gmt 0)

one solution i can think of is to use tables:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<HTML>
<HEAD>
<STYLE type="text/css" media="screen">
#sidebar {
width: 10em;
height: auto;
background:#FF0000 repeat-y;
clear:both;
border:2px solid #ff00ff;
}
#main {
width: auto;
height: auto;
border:2px solid #ff00ff;
}
</STYLE>
</HEAD>
<BODY>
<table border="0" cellspacing="0" cellpadding="0">
<tr>
<td id="sidebar">Sided ... </td>
<td id="main">
<p>TEST TEST TEST TEST</p>
<p>TEST TEST TEST TEST</p>
<p>TEST TEST TEST TEST</p>
</td>
</tr>
</table>
</BODY>
</HTML>

webeno

10:11 pm on Apr 21, 2010 (gmt 0)

i think i found a good article for you that exaplains all the ways you can work this: [ejeliot.com ]

ravi

8:44 am on Apr 28, 2010 (gmt 0)

Thanks webeno,

Thanks for the example,i have fixed using ur example