SimpleQuiz › Part X › Multi-Paragraph List Items › Conclusion

I’ve been meaning to recap the last SimpleQuiz question for awhile now. You know, the Holidays…

Looking back on multi-paragraph list items, it appears that (to me) option C might be the way to go — using CSS to modify any default top paragraph padding (as Mark Newhouse suggested using a descendant selector). Using the :first-child pseudo-class would also work, but with mixed support.

But aside from the styling, the real debate could be, if you were to use C — would you wrap single paragraph list items in paragraphs as well? Seems like overkill, yet strange to have only mult-paragraph items use paragraph tags and the rest just live in <li>s.

I’m not intending to restart the debate — just some holiday fruitcake for thought.

To me, a list item is just that — a list item. Not necessarily a paragraph of text. It would seem extraneous to add paragraph tags to all short items for the purpose of making the multi-paragraph items feel more at home. Is there anything wrong with having paragraph tags only on multi-paragraph list items and not single items? I don’t think so, but when I re-read the question, it sort of strikes me as unecessary to ask.

Yet, it could also be the time of year. The time where it’s hard to get your mind back in the swing of things. When I all I really want to do is watch bad movies while making the best selection I can from an assortment of Russell Stover chocolates.

13 Comments

  1. Alex H. says:

    Semantically, you shouldn’t use any more tags than necessary when coding a page, and that goes for extraneous <p>s too.
    But personally, I’d throw them in anyways, just for consistency’s sake. And who knows, they might come in handy when you need some more styling hooks…

  2. As to the question whether all <li>’s should be marked up in <p> tags—This of course depends on the contents of the list. A list of links should be just a list, with items containing <a>’s.
    List items should only be marked up containing paragraphs if the content actually is a paragraph.

  3. dusoft says:

    I feel that sometime [p] are not needed, but at the same time I have urge to put them in most places. But of course for single item, they would be redundant.

  4. David House says:

    If you really needed to make it multi paragraph, you could sum it up with a dt and stick the paragraphs in a dd.

  5. Will says:

    I agree that the embedded paragraph tags seem out of place in a group of list items and that perhaps multiple paragraphs aren’t appropriate in the first place. I would imagine that a more realistic scenario would involve a definition list with terms and descriptions. For example, a list of ingredients in a, ahem, chili recipe with some additional information. That scenario may not always fit the traditional “term, description” format, but I think it is more likely to be encountered in everyday content management.
    <li>
      <dl>
        <dt>Term 1</dt>
        <dd>Description</dd>
      </dl>
    </li>
    <li>
      <dl>
        <dt>Term 1</dt>
        <dd>Description</dd>
      </dl>
    </li>

  6. Matt Haughey says:

    The original reason I asked Dan about the best way to mark up paragraphs in lists was due to legal documents I was posting online.
    Check out this chunk of legalese and you can see why lists were used to organize everything, even though some chunks of text within a list could be hundreds of words.
    They’re classic outlines, and what I thought the original creators of the list spec had in mind when writing the first web standards.

  7. Andrea says:

    Matt, I’m curious why you chose to make the numbers just numbers and not nested lists. Was it because the legal content tends to be static? Whole pages may change but not bits here and there in a single page? I have a bunch of FAQ pages I’ve done that look similar to your page, and I liked using ol because my clients really like to add and remove things. With ol I don’t have to worry about getting the count wrong.
    And yes, I have some items at the top that are one line each and then lower in the body of the FAQ they have one or more paragraphs. I find that while I try to keep my code as succinct as possible I will add “extra” tags to make all the markup of a section the same. It adds bulk, but later I can search and replace or style it with wreckless abandon. Uh, I mean with careful forethought and testing. ;-)

  8. Matt Haughey says:

    Oops, the legal stuff is all in lists, but not on the live server (I wasn’t going to make it live until I solved this problem). Some of the list items contain several paragraphs, which is what prompted the question.

  9. taestell says:

    Maybe I’m being too semantic here, but I tend to use p tags for only full sentances, and most of my li tags seem to contain only sentance fragments. We’ve all seen lists that look something like the following:
    My favorite websites are…
    - Splorp, because of his Available Domain Name of the Week feature
    - Waferbaby, because of his photography
    - Zeldman, because of his standards-compliance knowledge
    Look at only the content of those list items. I don’t know about you, but I probably wouldn’t wrap any of those in p tags by themselves.

  10. taestell – excellent point. Oftentimes, list items are not sentences at all, and therefore aren’t paragraphs either. That could be a good guide for using paragraphs for markup or not.
    In the case of Matt’s lengthy legal list (sorry), the items certainly are paragraphs. I’m still stumped on whether to wrap single paragraphs with <p>s in those cases though.

  11. Will says:

    I see now what Matt was getting at by posing the question; I hadn’t considered the case of legalese using multiple paragraphs in a single item. I still have the same problem as Dan, though: whether or not to wrap single paragraphs with <p> tags if you’re also using list items with multiple paragraphs. I’m actually surprised that no one’s suggested we might need a new tag to address the problem, though. Just because it hasn’t been done before, doesn’t mean that it couldn’t or shouldn’t be added to the spec in the future. What if there was a <lp> (list paragraph) tag? It might be used like so:

    <ul>
      <li>List item 1</li>
      <li>
        <lp>List item 2, paragraph 1</lp>
        <lp>List item 2, paragraph 2</lp>
      </li>
    </ul>

  12. Olivier says:

    What about putting additionnal paragraphs in a special with list-type: none? Like this:
    <ul>

  13. Garrett says:

    Oliver, you should read here/a>. Good luck!