-1

Possible Duplicate:
Using “margin: 0 auto;” in Internet Explorer 8

I am trying to center a div using margin: 0 auto; I have also explicitly given it a height but in my particular situation, it's not working. It works on other browsers. Can someone please tell me why it's not working in my particular situation? Here's a jsbin link

http://jsbin.com/afukif/43/edit.

Community
  • 1
  • 1
user104876
  • 7
  • 1
  • 4
  • Try adding "text-align:center;" to the body tag. I suspect it's something to do with the jQuery width you're setting to "container" though. – Billy Moat Nov 21 '12 at 17:16
  • Which `div`? Please post the applicable code within your OP for the benefit of future readers. – Sparky Nov 21 '12 at 17:47

3 Answers3

2

margin: 0 auto is with respect to the element's parent. If the parent is the same width as your target, then margin: 0 auto; will do nothing. In this case, it looks like the parent element is body. Set this in CSS:

body, html {
    width: 100%;
}

Tested in IE 8:

http://jsbin.com/afukif/61/edit

Sparky
  • 96,628
  • 25
  • 194
  • 277
0

In internet explorer you typically have to set the parent element with text-align:center; and then set the inside element alignment to left. I've had to do this several times because IE doesn't always recognize margin: 0 auto;. Also make sure that the if you are using margin: 0 auto; that you set a width for the element that you are trying to center. Otherwise it doesn't know how to calculate the margins.

Progdom
  • 91
  • 7
-3

Try

margin-left: auto; margin-right: auto;

A. Gilfrin
  • 296
  • 1
  • 7
  • Please explain in detail why your solution would work any different/better than the OP's shorthand version, `margin: 0 auto;`? – Sparky Nov 21 '12 at 17:44
  • It wouldn't, but then again it's IE8. I think it's always worth trying the long hand version if you are not getting your desired results. – A. Gilfrin Nov 22 '12 at 09:32