how to display a bullet list using ionic framework?
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.
<section>
<ul class="my-nav">
<li>List item</li>
<li>List item</li>
</ul>
</section>
.my-nav {
list-style-type: disc;
}
I could not see the bullets either, they were just not on the visible page. Adding some padding fixed it:
<style>
.my-modal-list {
list-style-type: disc;
padding: 20px;
}
</style>
<ul class="my-modal-list">
You can gave a class for the ul
element and define your own style.
HTML:
<div id="list">
<h5>Just three steps:</h5>
<ul>
<li>Be awesome</li>
<li>Stay awesome</li>
<li>There is no step 3</li>
</ul>
</div>
CSS:
#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