My icons keep aligning to the left:
<section class="section-what-i-do">
<div class="container">
<h2>What I do</h2>
<p class="sub-header" id="learn-more-section">Studying, creating, learning</p>
<div class="row">
<div class="col-md-4">
<i class="ion-ios-monitor-outline icon-large"></i>
<h3>Computer Science</h3>
</div>
<div class="col-md-4">
<i class="ion-ios-cloudy-outline icon-large"></i>
<h3>Web development</h3>
</div>
<div class="col-md-4">
<i class="ion-ios-bolt-outline icon-large"></i>
<h3>Learning new tech</h3>
</div>
</div>
</div>
</section>
Css:
.icon-large{
font-size: 350%;
text-align: center;
margin: 0 auto 10px auto;
color: #e74c3c;
}
I prefer using ionicons fonts over Bootstrap glyphicons.
The icons seem to be aligned to the left, giving the impression that there might be a float: left in the code somewhere.