ansaurus

Question

Centering DIV with IE

Answer 1

A:

This link should help you out: http://www.maxdesign.com.au/articles/center/

Nico 2010-10-21 13:41:25

Thanks. Seems like the problem was "text-align:center;" even when using IE9!

Joel 2010-10-21 13:43:43

@Joel Please explain further, I'm curious ...

Šime Vidas 2010-10-21 13:48:46

I used the HTML I showed above. I run the file in the browser and the DIV is aligned to the left. Only when I use "body { text-align:center; }" then the DIV really appears in the center...

Joel 2010-10-21 13:51:07

And i am talking about IE9

Joel 2010-10-21 13:51:51

Answer 2

A:

Try this;

#container {
 margin:0 auto;
 width:950px;
 height:50px;
 background:#000;
}

Rob 2010-10-21 13:48:54

Using margin: 0 auto; makes not a shred of difference

Alex 2010-10-21 13:51:04

@Alex Be careful, I wouldn't be surprised if this change would make a difference in IE. IE has lots of weird bugs

Šime Vidas 2010-10-21 13:53:21

Trust me, it's not. It's because the poster most likely doesn't have a valid doctype. Although I do understand where you are coming from having dealt with plenty of IE bugs in my time!

Alex 2010-10-21 13:57:47

Why the -1 vote?? I'm only trying to help out here..

Rob 2010-10-21 14:16:45

Answer 3

A:

This should help you out:

body {
    text-align: center;
}

#container {
    text-align: left;
    margin:auto;
    width:950px;
    height:50px;
    background:#000;
}

You do nothing wrong, IE6 does: it ignores "margin: auto;"

Thomasz 2010-10-21 13:50:29

This method hasn't been required since IE5.5 I believe. Auto margins have always working in IE... it's just a case of making sure the browser isn't rendering in Quirks Mode.

Alex 2010-10-21 13:56:29

IE9? maybe next time you have to say you're talking about IE9.

Thomasz 2010-10-21 13:56:57

IE9 beta to be precise...

Šime Vidas 2010-10-21 14:01:21

Answer 4

+3 A:

Check that you have a valid doctype. This behaviour usually associated with the browser rendering in Quirks Mode:

http://www.ahallicks.co.uk/ie.html

Alex 2010-10-21 13:55:38

That was the problem!! Thanks! :)

Joel 2010-10-21 13:57:06

This is the correct answer. Make sure that the doctype is on the very first line of the code in order to keep IE from firing up quirks mode. In quirks mode, IE ignores the margin:auto; style.

Riley 2010-10-21 13:57:51

Awesome, great!

Joel 2010-10-21 14:01:49

@Riley +1 for the helpfull coment! Never realized that.

Rob 2010-10-21 14:24:21

ansaurus

tags:

views:

answers:

Centering DIV with IE

related questions