DEV Community

Joel Diharce
Joel Diharce

Posted on

Unordered lists need love too

Ok, so the next best thing to ordered lists for an ADHD brain are unordered lists. These are great for to-do lists, or just list of items to retrieve - no particular order is needed.

Like the ordered list, there are two sets of open/close tags that we use to make an unordered list.

First, we have the <ul> tags. These work the same exact way as the ordered lists <ol> tags in that they define the beginning and end of the unordered list.

Second, we have the <li> tags, which work exactly the same as the ordered list's <li> tags in that they define the contents of each item in the list.

Example time!
Here is the code as written:
House chores:
<!Doctype html>
<html>
<head>
<title></title>
</head>
<body>
<ul>
<li>Dishes</li>
<li>Kitchen counters</li>
<li>Floors</li>
<li>The bane of my existence - the cat litter</li>
</ul>
</body>
</html>
Enter fullscreen mode Exit fullscreen mode

(Forgive the long code, but I discovered that since I use VS Code, I don't really remember the skeleton of an HTML page. I decided to remedy this, I should exercise the retrieval of that memory by recreating it each time in each example. :D)

Here is the code as I intend the user to view it:

House chores:

  • Dishes
  • Kitchen counters
  • Floors
  • The bane of my existence - the cat litter

It's true, cat litter is the worst. --;


One weird thing I discovered when using html with this blog:
I needed to change the code that I have in the code block above in order to display the intended view as I _truly
intended the user to view it. I had to remove the <!Doctype html> tag completely, and then put the following 6 tags in one line like so: <html><head><title></title></head><body>


It's bedtime now. 🥱😴

Top comments (0)