how to display a bullet list using ionic framework?

Using ionic to build an app, and I have a need to display an actual bullet list:

  • item 1
  • item 2
  • item 3

However, it appears that the framework does some sort of CSS reset / magic on <ul> and <li> elements such that they should only be used as structure elements (e.g. a list), rather than as UI.

I ended up creating my own unordered-list CSS style to give me the UI I needed. Is that the right way to do-it-yourself - or does ionic have some CSS style buried deep inside that I should have used instead?

ty in advance.

Just overwrite the reset.

ol, ul {
  list-style: none;

Like this (place in your CSS after the CSS of the framework)

ul {
  list-style-type: disc;

Best practise: set a class on the navigation element namely the ul.

  <ul class="my-nav">
    <li>List item</li>
    <li>List item</li>

.my-nav {
  list-style-type: disc;

You can gave a class for the ul element and define your own style.


<div id="list">
  <h5>Just three steps:</h5>
    <li>Be awesome</li>
    <li>Stay awesome</li>
    <li>There is no step 3</li>


#list {
  width: 170px;
  margin: 30px auto;
  font-size: 20px;
#list ul {
  margin-top: 30px;
#list ul li {
  text-align: left;
  list-style: disc;
  margin: 10px 0px;

See demo