It looks like your WordPress Theme has a fixed width for the container of the content and sidebar. The content and sidebar are both floating and have a combined width that is greater than the width of the container, which causes the sidebar to get push down. You will need to modify the width of one of these three elements in your theme to correct the problem by editing the CSS in the style.css file. (It’s most likely in the style.css file, but not always.)
Well I want that width for the banner and div (I think it’s called). What would I have to adjust the sidebar to in order to push it back?
Most support people don’t look at the newest tickets, so bumping doesn’t help.
You appear to have the Firebug add-on for Firefox. You can inspect elements to see what the HTML code looks like, as well as what CSS is being apply to elements of the theme. If you right-click on your sidebar and click Inspect Element, it will pop-open a window and have some element selected. Look for a parent element of that selected item that is a div tag. If you hover over the div tag it will select the entire sidebar in your browser. Click on that div tag and look at the CSS that is being applied. It will list the styles from most important to least important. Look for one property called width, then go change that value in your theme. If your do it in Firebug it will show you the change temperately, so you will have to use FTP or WordPress editor to change it for real.
For the TwentyTen Theme the CSS in Firebug will look like this:
#primary, #secondary { style.css (line 71)
float:right;
overflow:hidden;
width:220px;
}
I see it. Changing width will move it back up? How do I move it back towards the top?
Browsers will wrap content if it gets to big. This includes words in paragraphs, but also child elements in a parent element. Since the content and sidebar elements have a combined width that is larger than their parent element, the sidebar is wrapped down into a space that will fit it. The fact that it doesn’t appear to wrap like text is due to the fact that text has all the same alignment for a paragraph, while child-elements can be aligned independently, so it appear to have only been moved down.
Here is an image showing the invisible borders around each element: http://imagebin.ca/view/H4MkadYP.html
I think I get it. Well how do I shrink the content area to fit the sidebar?
The same way I told you how to do the sidebar. You look through the code until you find what div tag is wrapping the content, then find the CSS that is styling that element, and edit the width of the content or the margins of the content.
I could have told you what lines of code to edit and what to edit them to, had you told me what theme you are using or had you provided a link to your website. It helps to actually see the problem first hand. I can still do this for you if you provide more information.
http://www.sofarhome.com
Sorry for the really late response. Could someone tell me what code is wrapping it?
