List block styles

Page used to check styles applied to UL and OL

Jump to:

• Unordered lists
• Ordered lists
• How to Make Bread
• How to Make Cookies
• Heart
• FSRI top 10 list

Unordered lists

Unordered list, normal

• Unordered list
• 2
• 3

---

Unordered list with inline style, should display inline

• Unordered list
• 2
• 3

---

Unordered list with checkmark, should display checkmark

• Unordered list
• 2
• 3

---

Ordered list with colored circles applied to block

1. Unordered list
2. 2
3. 3

---

Unordered list with colored numbers, should do nothing and display admin warning

• Unordered list
• 2
• 3

Ordered lists

Ordered list, normal

How to Make Bread

1. Ordered list
2. 2
3. 3

5. Ordered list
6. example
7. example

---

Ordered list with colored numbers, should work as designed

How to Make Cookies

1. Step 1: Ordered list
2. Step 2: text here to describe step
3. Step 3: text here to describe step

List break

4. Step 4: text here to describe step. Ideal scenario would be this could be set as #4
5. Step 5: text here to describe step
6. Step 6: text here to describe step

More steps

12. Step 4: text here to describe step. Ideal scenario would be this could be set as #4
13. Step 5: text here to describe step
14. Step 6: text here to describe step

Ordered list with colored numbers inside tip box

Ordered list with colored numbers, use case in instructions pattern. We'll want to get the number overlays on images to work to deter people from doing this & it not working.

---

Ordered list with inline list, should do nothing and display admin warning

1. Ordered list
2. 2
3. 3

---

Custom list style

• this
• is
• a
• custom
• list

Ordered list with checkmarks, should do nothing and display admin warning

1. Ordered list
2. 2
3. 3

1. This is an ordered list block
2. It's good to itemize sequential steps or items in an ordered list
3. Using lists to break up your content makes it easier to parse, and is a good user-experience

FSRI top 10 list

FSRI top 10 list #2 should start with 1