Take the 2-minute tour ×  Using CSS, it's easy to horizontally
center text in a container using text-align:center;, but if any
single word of that text is larger than the width of the
container, the browser automatically "clips" to the left
boundary of the container (as in, the over-sized word aligns
with the left side of the too-small container, and without the
CSS word-break:hyphenate; property setting (or similar) the
over-sized word sticks out past the right edge of the container.
enter image description hereAny way to float this pic left of my
text here to save vertical space? Oh well. Anyway...  Without
using a child container element to hold the text, is there a way
to center the over-sized word so that it hangs over both left
and right sides of the container equally?  Again, I do not want
to use a text container within the container. I could do this in
5 seconds by using a child <div>text to be centered</div> with
fixed width and negative margin-left, or with absolute
positioning of a container eleme