Why is this apearing center in some browsers?

Red Squirrel

No Lifer
May 24, 2003
70,662
13,834
126
www.anyf.ca
Figured it out.

Opera does not seem to support using text-align:left if it's not in the html tag itself as a style="". Same with IE. Kinda defeats the purpose of .css files though. There's also some other weird html stuff in that template that might be causing issues.
 

Woosta

Platinum Member
Mar 23, 2008
2,978
0
71
Huh? Most likely an inheritance issue , one of your styles override the text-align property and value as it came later, hence the 'cascading'. The markup looks a little too 1999ish to really go through, as this relies on a table and not everything is tabular data.

FYI, horizontal auto margins on a block level element staticly positioned which is not floated would horizontally center the element, provided the element has width ( in almost all cases except special elements such as table which have a proprietary display mode and don't really need an explicit width set to be horizontally centered, and block level replaced elements (explicitly set, not native ) such as <img> ).

In other words, div#wrapper { width:50em; margin:0 auto 10px; } would horizontally center that division which is natively block leveled. And here is an example of cascading:

body { background:red; }

body { background:blue; }

You set it to red, later on a declaration is interpreted by the user agent and overrides the initial declaration which set it to blue. Tools like Firebug ( Mozilla / Gecko ), Drosera ( Safari ), Dragonfly ( Opera ) can help you locate and resolve issues such as this.

You manually set it inline on the element, such as <body style="background:red;"> which has higher specificity than body { background:blue; } which belonged in an external stylesheet and did not have an important declaration.

You could solve it by adding that important declaration, or making a more specific rule. eg body { background:red !important; } or body#foo { background:red; } ( except in this case, text-align).