For some reason if I put something like this:
<div whatever>
<p (floats left)>
<ul>
<li>whatever</li>
</ul>
</p>
test test test
</div>
The <P> floats left like it should, but the list and such appear OUTSIDE the thing on the right... why?
One more quick question while I'm at it: How do I do a <br>? I know we're supposed to avoid those so what do I do to drop down two lines inside a <P>?
Welcome,
We at .... blah blah
It'll turn out like:
Welcome, We at ...
without anything...?Not sure about the 1st problem, but the 2nd one is easy:
<p>Welcome,</p>
<p>We at blah...blah...blah...</p>As far as the first problem, per the spec., "The P element represents a paragraph. It cannot contain block-level elements (including P itself)." And, since the closing tag for P is optional, once it hits the UL tag it is closing your paragraph automatically, and thus the P's style does not affect the UL. A better markup would be:
<div "style=float: left">
<p>Text before the list</p>
<ul>
<li>list item 1</li>
<li>list item 2</li>
</ul>
<p>Text after the list</p>
</div><p>Welcome,</p>
<p>We at blah...blah...blah...</p>
Cool! I never knew about that. Neat!http://www.dynamicsitesolutions.com/css/list_in_paragraph/
<div whatever>
<p (floats left)>
<ul>
<li>whatever</li>
</ul>
</p>
test test test
</div>
The <P> floats left like it should, but the list and such appear OUTSIDE the thing on the right... why?
One more quick question while I'm at it: How do I do a <br>? I know we're supposed to avoid those so what do I do to drop down two lines inside a <P>?
Welcome,
We at .... blah blah
It'll turn out like:
Welcome, We at ...
without anything...?Not sure about the 1st problem, but the 2nd one is easy:
<p>Welcome,</p>
<p>We at blah...blah...blah...</p>As far as the first problem, per the spec., "The P element represents a paragraph. It cannot contain block-level elements (including P itself)." And, since the closing tag for P is optional, once it hits the UL tag it is closing your paragraph automatically, and thus the P's style does not affect the UL. A better markup would be:
<div "style=float: left">
<p>Text before the list</p>
<ul>
<li>list item 1</li>
<li>list item 2</li>
</ul>
<p>Text after the list</p>
</div><p>Welcome,</p>
<p>We at blah...blah...blah...</p>
Cool! I never knew about that. Neat!http://www.dynamicsitesolutions.com/css/list_in_paragraph/