Can a <p> "contain" a block-level element?

Can a <p> contain like a <div>?

[adkantoro]

In the example below, the <p> has a border.

However, if a a block-level element, say a <ul>, is inserted into the <p>, the border only encompases the part of the <p> UP TO the that element.

<p style="border: thin solid black;">

Only this text will have a border

<ul>
<li>a list item (no border)</li>
</ul>

paragraph text after the list (no border)

</p>

It's as if the <ul> draws a </p> above itself.

Is there a work arond?

I know that i can get the desired effect by replacing the <p>...</p> with <div>...</div>, but besides that?

Thanks

[encyclo]

As a

<p>

does not require a closing tag the

<ul>

automatically closes the paragraph, and the text after the

</ul>

is no longer in a block-level element. Also, as you suspect, a

<p>

cannot contain another block-level element anyway.

Your only solution, as you suggested, is to place the border on an enclosing

div

instead:

<div style="border: thin solid black;">

<p>This text will have a border</p>

<ul>
<li>a list item</li>
</ul>

<p>paragraph text after the list</p>

</div>