H2 and paragraph, inline?

I know paragraph and headings are block elements, so that's why I'm having a time wrapping my mind around what's the best way to do this accessibility-wise.

Let's say for instance I have copy like this:

*This is the heading.*This is the paragraph, blah blah blah blah blah blah blah blah blah blah blah 开发者_StackOverflow社区blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah.

How would my HTML and CSS display this properly?

h2, p {
  display: inline;
}
div.p {
  /* whatever margins/paddings you would normally apply to p */
}

and

<div class="p">
 <h2>This is the heading.</h2>
 <p>This is the paragraph</p>
</div>

You would need to enclose all <p> in a block level element (like <div>) to avoid that consecutive paragraphs collapse.

You're almost answering the question yourself ;)

h1, p {
  display: inline;
}

Not sure if it works in IE6 though (I was confused with inline-block here, inline works fine in all browsers)

alternatively:

h2
{
  float: left;
  /* adjust h2 font-size etc as needed */
}
...
<div>
 <h2>heading</h2>
 <p>Paragraph</p>
</div>

This has the advantage of still being able to specify margins, paddings, etc on the h2.