So, I have this code
<div class="featurette">
<img class="featurette-image pull-right" src="img/BreadBakersGuildLogo.jpg">
<div class="text-center">
<h2>Justin</h2>
<p class="lead">
Stuff about Justin
</p>
</div>
<div class="pull-left">
<ul>
<li>Stuff about contacts</li>
<li>Stuff</li>
</ul>
</div>
</div>
Unfortunately, the text under text-center isn't centered. It appears to be a little to the left. I also made this fiddle to demonstrate what I mean.
Thanks!
The issue is:
You are using .container for <body> which has a width: 940px and p has a display: block and it is rendering with reference to the 940px.
One solution would be, to use .container{ width: 100%}, as you might run into this issue at a later point of time too.