I've noticed today a little quirk when using a <div> tag within a table. When a <div> tag is embedded within the <td> tag, the text-align: center is not being recognized by Firefox 3. IE understands the text-align style but not Firefox. I've found that by using a combination of two div tags, works effectively for these browsers. Not just inside a <td> tag but this also works when trying to center a <div> tag within another <div> tag.
The snippet below contains the styles for the <div> or paragraph tags.
1: .center
2: {
3: text-align: center;
4: width: 100%;
5: }
6: .center_ff
7: {
8: margin-left: auto;
9: margin-right: auto;
10: text-align: left;
11: }
Utilizing the style is pretty much just having to embed it as such (see code below). I suppose that you have a maincontainer such as the one below but this can be a <div>, paragraph, or a <td> - any tag that contains items.
1: <div id="maincontainer">
2: <div class="center">
3: This text centers automatically since these are regular text.
4: <div class="center_ff">
5: This doesn't, thus we have to use the class "center_ff".
6: </div>
7: </div>
8: </div>