Problem with consistent page centering and IE compadiability problem

[DarkStar]

Hello everyone.

I am quite new to web development and I have been working on my first website. I have a slight problem with my page centering correctly when I resize the browser window. You see, I have an image to the left of my banner, that is held in a css container of the appropriate width. I have experimented with overflow:hidden and I have been out of luck. I also do not want a horizontal scroll bar to appear because an image or the flash banner is out of bounds.

I have tried html { overflow:hidden; } ...and that works, but it also hides everything that is vertical as well. I have also tried placing overflow:hidden; on the container that refers to the header id in my html file.



Problem #2:
I am having a browser compatibility issue with how my content is displayed in IE7 or below. My page displays fine in IE8, Firefox 3+, Chrome, Opera, and Safari. IE7 placed the bottom shadow box image of my page content at the very top.

Here are screenshots that describe my problems. Can anyone please help, I have spent a few hours trying to solve this and I'm sure it's a simple fix whatever it is.

http://yfrog.com/cahelpscreen1j
http://yfrog.com/5chelpscreen3j
http://yfrog.com/j5helpscreen2j

[<CrGeary.com/>]

Without your css and html, its a bit difficult to explain why this is happening,

firstly, im assuming you have that scroll bar because you have given your website a height that is bigger then the browser window.

Also to centerize stuff you can use: (depending on the browser)


margin:auto;
text-align:center;

If you post back with your html / css then ill have another look at your problem.