Hi, I have been going nuts trying to figure out what happened to my code.
On my site, http://tweeaks.com, when you re-size the browser window you will see the header and footer areas become mis-aligned. The header seems to move to the left away from the right side more than the footer does too, which I can’t understand.
There are a number of embedded styles too, but I don’t think they are causing the problem.
The theme I have is a free theme I got a while ago, and basically hacked and modified to hell. I’ve been needing to just strip all the needless code from it but haven’t had the time to sit down and do that.
I realize I posted this almost 2 months ago, but I realized that I must be doing something wrong in the way I write CSS.
I still didn’t solve the original problem, and now have the same problem on a new wordpress theme I’m developing.
When you resize the window, you can see the header and footer background image pad inward away from the edge of the browser. When It’s viewed in full screen you don’t notice it. I have tried so many things to fix it and I can’t figure out what it is that causes it.
You don’t say which browser or platform you are having the problem with. I tested on Firefox in Mac, and on Safari, IE7 and 8 on XP and cannot see your problem in any of them. The only thing I saw was that you need a png fix for IE6.
P.S. You have a typo in tweakurpages – Beginner has only one g.
It does it in all browsers, and Im using a PC but im sure the OS doesnt matter.
What you have to do is take the browser off full screen. And resize it smaller, and scroll horizontally all the way to the right, and you will see the header and footer backgrounds aren’t 100% full width. If you make the window larger and smaller, you will see the backgrounds pad in and out, as though there is a set percentage padding-right set somewhere, but there isnt.
I’ve tried so many things and nothing has seemed to work.
Tweakurpages is just a test site, i dont care about typos, but thanks for letting me know.
I’m not quite sure, but on a quick look at your html and css of Tweeak.com i noticed that your footer is 950px wide and you put a image in with a width greater than 950px. I would never do that… Beside that your content is 960px, while your footer as seen in a browser is wider than the content. Weird.