SideBar Image Repeat |
 Oct 7 2009, 10:31 AM
Post
#1
|
|
 Senior Member  Group: Member Posts: 42 Joined: Jan 2006 Member No: 365,078  |
How do I get my sidebar image repeat (no matter how much content it has) so that it goes all the way to the footer? I'm going crazy trying to figure it out. This is what the layout looks like:
|
|
|
|
 |
Replies
(1 - 5)
|
Oct 7 2009, 02:44 PM
Post
#2
|
|
 Live long and prosper. Group: Staff Alumni Posts: 10,142 Joined: Apr 2007 Member No: 514,926 |
is this fluid css or divs?
|
|
|
|
|
Oct 7 2009, 04:03 PM
Post
#3
|
|
 simple and clean... Group: Official Designer Posts: 149 Joined: Nov 2006 Member No: 478,009 |
Short answer: You can't with CSS. But you can use a repeating background image to simulate it.
|
|
|
|
|
Oct 7 2009, 07:02 PM
Post
#4
|
|
 Offline. Group: Official Designer Posts: 609 Joined: Mar 2007 Member No: 507,591 |
You can take a look at this tutorial Equal Height Columns with Cross-Browser CSS and No Hacks, it very simple.
|
|
|
|
|
Oct 13 2009, 05:55 PM
Post
#5
|
|
|
Senior Member Group: Member Posts: 42 Joined: Jan 2006 Member No: 365,078 |
Thanks; it was CSS. I tried using that but the same problem occurs..the side bar still won't repeat:
CODE .container {
float: left; overflow: hidden; width: 100%; margin: 0 auto; } #content { background: url(images/content.gif) repeat-y; float: left; width: 65%; margin-top: 32px; padding-left: 15px; padding-right: 30px; padding-top: 10px; padding-bottom: 30px; min-height:100%; } #sidebar { background: url(images/sidebar.gif) repeat-y; width: 10%; min-height: 100%; margin-top: 32px; margin-left: -228px; padding-left: 15px; padding-right: 30px; padding-top: 10px; padding-bottom: 30px; float: left; } |
|
|
|
|
Oct 15 2009, 10:59 AM
Post
#6
|
|
|
Newbie Group: Member Posts: 4 Joined: Oct 2009 Member No: 749,226 |
Background-repeat will based on the height of its parent. Try to pud a height on it
|
|
|
|
 |
1 User(s) are reading this topic (1 Guests and 0 Anonymous Users)
0 Members: