WordPress.org

1. mattmattbowen
   Member
   Posted 7 months ago #

   Hi,

   My sidebars have suddenly decided to go to the bottom of the pages they are on. Any ideas why and how to fix it for an amateur would be very helpful.

   See this example

   http://www.mattbowen.co.uk/free-downloads

2. johnnybebopcool
   Member
   Posted 7 months ago #

   Looks like a CSS formatting issue. When I am troubleshooting this stuff, I like to add a 1px solid color border on each div in the structure to see what one is causing the issue. I suspect that your main content div and sidebar divs are too wide for the area assigned so it's kicking the floated element below.

   check these divs:
   #content
   .hfeed
   #tag_cloud-3
   .page

3. johnnybebopcool
   Member
   Posted 7 months ago #

   *css structure issue

   Also, check the div .aside

4. mattmattbowen
   Member
   Posted 7 months ago #

   Have changed the px value of the .aside in my screen.css file but doesn't seem to have had any effect.

   Also done the same with the hfeed value

   It did work at one time. Very frustrating.

   I'm not able to add the 1px you suggest as I wouldn't know where to start

5. johnnybebopcool
   Member
   Posted 7 months ago #

   The 1px trick is handled in the css file, either screen.css, or style.css. Also, sometimes content in a main content column will be wider than the specified width and you can hide the overflow to keep your css layouts from exploding.

   Try two things for starters, troubleshoot the div widths by adding the border: 1px solid red; (or a different color for each div so you can tell them apart) and seeing if the overflow of the content can fix the layout issue.

   so, add this to your existing css and use the border on other divs on the page, like #content.
   

   .aside {border:1px solid black;}
   .page {border:1px solid red; overflow:hidden;}

Reply

You must log in to post.