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.
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.