css text-align overruled?

Question

I have a <div> with text-align:left - inside that: a <p> with text-align:center.
The "closest" property should win = center - but it doesn't all 3 <p>'s are left-aligned ?!?
Same result in both Firefox and Chrome - This is how it looks in Chrome's "inspector":
NB: I can't reproduce it in a simple html-file..
Any idea what's happening here ?

EDIT: Found it finally: I'd hyphenated (those damn invisible shy's) a little too thoroughly...

Answer 1

The problem was "silent hyphens" (& shy;) in my CSS.

Answer 2

From what you've shown us, it doesn't make sense. But I'm going to guess that, somewhere in a CSS file, there is something like:

p {text-align: left !important;}