Title: Variable Length Sidebar Last modified: August 18, 2016 --- # Variable Length Sidebar * [Alex Cragg](https://wordpress.org/support/users/epicalex/) * (@epicalex) * [18 years, 10 months ago](https://wordpress.org/support/topic/variable-length-sidebar/) * hi, i sat down today to design a new site at [http://www.mysoutham.com/kclultimate](http://www.mysoutham.com/kclultimate) and ive come to a problem i cant work out. * It isnt really a problem, i just need some advice on how to do it, and im sure its pretty simple. * I have a sidebar on the right, and i have an image to ‘box’ it in. As the sidebar length can be variable, i understand that i need to split this into 3 parts, a top, middle and bottom. * What i dont know how to do, is which part of the css to use to list these parts as backgrounds? do i set up spans? or divs? or just on some of the ul tags? * I havent touched any other template for the time being other than the page.php one, so the homepage will be the only real place to look. Single.php etc will look screwed, and also IE has some margin problems as always, but i will fix those later, and my XHTML is all valid(so far!) * I know this is easy for someone, but i cant get stuff to line up right at all. * Thanks in advance 🙂 Viewing 5 replies - 1 through 5 (of 5 total) * [DianeV](https://wordpress.org/support/users/dianev/) * (@dianev) * [18 years, 10 months ago](https://wordpress.org/support/topic/variable-length-sidebar/#post-602939) * You’re going to have to play with sidebar.php and style.css. * I haven’t looked at your code and CSS, but I think the easiest way to go about this is to attach (in the CSS) the sidebar background to the body of the sidebar area. Then add the top and bottom, respectively. You *could* do it with divs ( rather than spans). You’ll probably have to play around with the CSS to get it to line up correctly. * Tip: because browsers tend to display things a little differently (at least some of them), it helps terrifically if the background widths are even numbers of pixels … that is, 180px wide (rather than 179px). * Thread Starter [Alex Cragg](https://wordpress.org/support/users/epicalex/) * (@epicalex) * [18 years, 10 months ago](https://wordpress.org/support/topic/variable-length-sidebar/#post-602967) * ok, what i have done is put the top as the #sidebar background, and the middle as the #sidebar ul background. * I tried to put the middle as the #sidebar background, but it then extended down below the bottom, if i put the bottom part as the #sidebar ul. * so i now somehow need to add on the bottom. I tried using a div at the end of my sidebar, but still within it, but nothing showed up, even if i gave that div a height and width. * so i tried using a span, but ive never used one before, so dont really no how to go about it, and i cant find any documentation on it. * how should i get the bottom attached? * thanks again * [jamesict](https://wordpress.org/support/users/jamesict/) * (@jamesict) * [18 years, 10 months ago](https://wordpress.org/support/topic/variable-length-sidebar/#post-602970) * You could do something like: * ```