Appears to work in current Opera and Konqueror, little
else (Mac IE?). Need to put a space either at the end of
the <h3> or at the beginning of the following paragraph or,
as here, insert one using a pseudo element.
followed by a paragraph containing arbitrary nonsense to fill space.
Another paragraph.
and paragraph
Using display: inline, we lose the
:first-letter styling because that doesn’t
apply to inline boxes. Also requires spurious mark-up in the
form of an break or empty paragraph to prevent an
<h3> running-in to the previous
paragraph.
styling can, with irritating extra mark-up, be applied explicitly, but it would be nice to avoid this.
as with real run-ins, we have to put a
space at the end of the <h3> (before the
</h3>) or inside the beginning of the
first paragraph, otherwise there’ll be no space between the
last word of the <h3> and the first word
of the paragraph. Unfortunately there’s little point trying
to do it automatically, as several of the browsers for which
fake run-ins are necessary don’t recognise :after either.
arise if there is no block element between
the first paragraph and the next <h3>
This paragraph serves to avoid the problem.
between this first paragraph and
so they end up run together.
this <h3> is preceded
by an empty paragraph, which might introduce excess
space. The previous ones use an empty paragraph styled to
take up less room.
this <h3> is wrapped in a div, which is
another kludgey way of avoiding that trouble, but
undesirable since it uses different padding/margin from
paragraphs.
Floating the <h3> seems attractive,
because that way it remains a block, so first-letter styling
still applies and there’s no problem with unintended running
together, so no need for that extra markup.
As far as I can tell this approach is fundamentally flawed because there’s no way to get the baseline of text in a float to line up with the baseline of adjacent text. Have I missed some way of doing this?
requires either padding-right, or an at the
end of the <h3> because ordinary spaces are lost
between blocks. The result is poor justification.
A second paragraph to follow the first one after the <h3>.
make a difference to the vertical position of the header?
A pointless extra paragraph.
between this one-paragraph <h3> and
the next.
2nd