Use of lists- necessity or a hindrance?

Or both. Why and when to use them? <ul> <ol>
From my experience with the Responsive Web Design Projects, they are used on every <nav> tag, yet it only causes me extra trouble and no tangible benefit. Each time im to negate their basic functions like list style, or i’d alter their display with flex. Often i need to insert anchors or other tags in them, which complicates targeting the right element to adjust font styles and colors and overall extends my styles code.
Would it not be much simpler to use directly <div><p><a><span><heading> tags to do the same job?

1 Like

ul is for UNordered List ( a bulleted list by default) while ol is Ordered List (a numbered list by default). The nav element defines a set of NAVigation links where you atleast nest ul and li element inside the ul.
An a (Anchor) elemnet is nested inside the list for the links.
The output should look ike this:

  • Link 1

  • Link 2

  • Link 3

  • Link 4

Then you style it in inline using CSS below

nav ul li { 
       display: inline;
}

This means make li inside ul which is inside nav display inline( in one line).

For more information you can view my codepen for the navigation link I have made for you

Use what you need, don’t use what you don’t need. No need to force anything.

Sometimes a list is nice when you have an actual list on the page, you know. Why not.

It can be very useful in React for component mapping like so. Just do what’s easiest and makes the most sense. Don’t avoid learning important things, but you know what I mean.

Sajjad im aware of the basics of the lists, but i could just use div instead of ul and i dont even have to put the links in separate element as they already are an inline element, or i could use span instead and this way i can get rid of unnecessary elements tweaking and additional styling. Lists really feels like obsolete element and im looking for a reason to use them, to justify the hindrance they usually come along with