Trying to get the hang of Bootstrap and its grid system. Here's my attempt at creating a footer using only some of the columns available. I'm having trouble centering the list items within the div, despite styling the elements. Can't figure out why it's not working even after tinkering with Google dev tools.
.wrapper{
width:80%;
margin:0 auto;
}
.footer{
margin:0 auto;
text-align:center;
}
HTML
<div class="row footer">
<div class="wrapper clearfix">
<div class="col-md-2 ">
<ul>
<li>Bob</li>
<li>Bob</li>
<li>Bob</li>
<li>Bob</li>
<li>Bob</li>
</ul>
</div>
<div class="col-md-2">
<ul>
<li>Bob</li>
<li>Bob</li>
<li>Bob</li>
<li>Bob</li>
<li>Bob</li>
</ul>
</div>
<div class="col-md-2">
<ul>
<li>Bob</li>
<li>Bob</li>
<li>Bob</li>
<li>Bob</li>
<li>Bob</li>
</ul>
</div>
<div class="col-md-2">
<ul>
<li>Bob</li>
<li>Bob</li>
<li>Bob</li>
<li>Bob</li>
<li>Bob</li>
</ul>
</div>
</div>
</div>