When you have a list of things (e.g. Tips) which also have a short paragraph beneath them, what is the best way to style them?
For example…
If that was in a Word document, I would bold and underline each tip, but I have been told underlining is just for hyperlinks.
Do I just bold them?
Should I bold and number them?
Indent them?
Something else?
Perhaps a description list.
<dl><dt></dt><dd></dd> etc
Not HTML, but more visual formatting…
You would simply style the dt and dd tags differently
You are not listening…
I said I am NOT asking which HTML tags to use. This is not the HTML/CSS forum.
I was asking visually which formatting approach would look the best and make the most sense for the web…
Is there a specific order to the entries in the list - if so then number them, if not then don’t imply an order when there isn’t one.
Okay, that was helpful.
(In the example above, no, no particular order.)
Would you underline the tip headings?
What about bullet points?
Or is just bolding things enough?
On the web underlined entries are links so if it isn’t a link it shouldn’t be underlined.
Try this:
#mikey_w li::first-line {color: blue;}
#mikey_w li::first-letter {font-size:2em; color:#000; font-weight: 700;}
Yes I know it is CSS, just play around with the styles until you find something suitable.
I like @felgall’s solution for indenting using lists.
Off-topic:
What is the HTML markup to create a list of things which also have a paragraph beneath them?
Based on just that information, I’d use a <dl>. But I always find it hard to answer these questions theoretically, as it would really depend on the context.
I am confused with the OP stating that a list was used with a paragraph below.
I agree that <dl> would be ideal since it has a title element and description instead of the stated paragraph inside a list.
Read my OP - there is nothing “theoretical” in what I said or in the example I provided.
There was an example in my OP…
And you also said you didn’t want to discuss what HTML to use. I was replying to John’s question, not yours.
Looks like this is the best approach so far. (As far as HTML, that would make this an Unordered List, although a Definition List could work also.)
Personally I don’t see an issue underlining headings/terms if they are in all black, but I guess standards dictate differently.
This is the correct approach. Just bold them, as in your second example. Indenting isn’t used much in the web; skipping space between points is enough.
This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.