Question

My page seems to be centered in all modern browsers except IE7. In CSS I have simply:

html, body {
    width: 1000px;
    margin: auto auto;
}

and it doesn’t work.

Another issue for all browsers is that whole page slightly moves after clicking menu items. E.g. choosing second menu item causes thah page is shifted to the right compared to third page. Could you help me how to solve these problems. TIA

Answer 1

To fix the first issue, remove html from the selector:

body {
    width: 1000px;
    margin: auto auto;
}

The second issue is caused by there not always being a vertical scrollbar, which changes the width of the page and so causes a slight horizontal shift.

Fix it by adding this, which forces there to always be a vertical scrollbar:

html { 
    overflow-y: scroll
}