Text alignment and overflow problem (harder than it sounds...)

[MusoSpuso]

To see the problem go to: http://castlevania.iwebland.com

As you can see, the h4 block is currently attached to the left margin as would be expected. What I WANT it to do is overflow on BOTH sides making it look like the word is floating above the box in a sense but still aligned centrally to it. I can get this effect by making a class with a left property of -(however many pxls) but I want to be able to accomplish this for all h4 without having to specify custom class settings of which there would be several because I'm going to have other boxes with other headings of various lengths.

Also, sort of related to the previous quesiton is if you can make inline content "attached" to the right margin. Alignment doesn't seem to really be the same because I've tried to right align text to a box that was too small and it still aligned itself to the left margin spilling outside past the right border (as in example). Only if there was enough room in the containing object would it right justify.

[Kevin Yank]

Are you sure that URL is right? I get taken to a simple "test page" which links to a forum that uses tables for layout and has no 'h4' elements at all...

[MusoSpuso]

Are you sure that URL is right? I get taken to a simple "test page" which links to a forum that uses tables for layout and has no 'h4' elements at all...

Yes you're right the real link should be: http://castlevania.iwebland.com/problem.html

[Lister14]

Yes you're right the real link should be: http://castlevania.iwebland.com/problem.html

why don't you create a container, where the other container (the dotted line) is central to, and which has the length of the longest h4 you,ve got...

[MusoSpuso]

why don't you create a container, where the other container (the dotted line) is central to, and which has the length of the longest h4 you,ve got...

That is indeed another possibility but still somewhat of a hack. I'm curious to know if there's actually a mechanism in css that can accomplish this without adding other containers or elements to hack my way through it. My objective is to try to stay as pure to the separation of structure and presentation as is intended by css but so far yours is probably the best idea for it, if I can't come up with anything else I might use it. Thanks.

[Lister14]

That is indeed another possibility but still somewhat of a hack. I'm curious to know if there's actually a mechanism in css that can accomplish this without adding other containers or elements to hack my way through it. My objective is to try to stay as pure to the separation of structure and presentation as is intended by css but so far yours is probably the best idea for it, if I can't come up with anything else I might use it. Thanks.

is that not where 'id' and 'class' come to their full intended function?

id is the big container, containing one or more classes of things, such as the h4 or the dotted box...