Quick Firefox CSS question

I want to centre a table within a div, which works okay in IE with

table {
display: block;
margin: auto;
}

But in Firefox it aligns on the left. Any ideas?

You sure it's not the other way around? IE doesn't handle margin: 0 auto; very well and Firefox does. Unless I'm missing some very important information that I need to know!

I am curious as to why you feel the need to be specifying; display: block; in your table styling.

Yes, the problem is with Firefox and not IE.

The reason I have display: block in my table styling is because I'm still something of a novice with CSS and it was suggested as a way of centering by someone else here.

Basically, I have a table of information which I need to sit centrally within a div. is there a standard way of doing this with CSS?

margin:0 auto?

__________________

Are you talking about horizontally centered, or both horizontally and vertically centered?

vertically centered is trickier but doable.

Example Here of Vert/Horiz centering with CSS

__________________

Your best cross browser solution would be to style the div with;

Code: Select all

text-align: center;

As this is inherited, you will need to change the text-align back at the table level for whatever you want it to be, probably;

Code: Select all

text-align: left;

If "margin: 0 auto;" doesn't center the table in Firefox, you should check your code -- you've made an error somewhere.

It'd really be helpful to see this in action.

Cracked it.

The display:block was unnecessary and margin: 0 auto on its own works.

Many thanks for your help.