When using bootstrap were not just limited to using that framework styles.
We can still add our own in a custom style sheet.
It's common practice to put style sheets in a folder called C Ss So let's add one.
And in here create a style sheet called styles dotsie SS.
Then in the header section it's turmoil.
Let's add a link element to load this style sheet after the bootstrap one so that we can override any
bootstraps dhows if we want and making sure we start the u r l of the file with a slash so that it always
finds this file in The Root.
Even if we include the header file in a sub folder.
In the main index page were using an ordered list element to display the list of blog posts by default
and on order the list shows a bullet next to each list item and each list item is indented.
We can remove the bullet by setting the list style type property of the list item elements to none and
remove the indent by setting the left padding.
If the U L element to zero.
First to identify the list element on the index page.
Let's add an I.D. to it.
Then in the stylesheet will add a selector for that element.
And first let's set the padding to zero.
We need to apply the list style type property to the L elements not the U.
Element.
So let's add another selector full list item elements inside this you know element.
Then we can set the list style type to none.
Now in the index the bullet points have gone and so has the left padding on the list items so they line
up nicely under the main title.
We can make this slightly more concise by moving the list style type declaration to inside the U L selector
and we can remove the other selector completely.
We can do this because list style type is a property that's inherited so any child elements of the U
L element.
In other words the L Y elements inherit this property.
And in the browser it looks the same.