Jordan
Jordan

Reputation: 143

Size content to viewport issue with Bootstrap

I was using Google's PageSpeed tool and came across an issue on my homepage that I'm not sure how to fix. The suggestion is to fix "Size content to viewport" but I've never run into this issue before using Twitter Bootstrap. Can someone please take a look at my site and see if there's something I'm missing?

<div class="row">
    <div class="container">
        <div class="col-sm-4 text-center">...</div>
        <div class="col-sm-4 text-center">...</div>
        <div class="col-sm-4 text-center">...</div>
    </div>
</div>

I've tried creating removing the "text-center" class from the div and that didn't seem to work.

PageSpeed: https://developers.google.com/speed/pagespeed/insights/?url=game-brain.com&tab=mobile

Website: http://game-brain.com/

Upvotes: 0

Views: 59

Answers (1)

Arun Sharma
Arun Sharma

Reputation: 1331

You have placed container inside row.kindly, place row inside container.

i.e.

<div class="container" style="margin-top:30px;">
  <div class="row">
    <div class="col-sm-4 text-center">
      <h4>Stay current</h4>
      <p>Play smarter by staying up to date with the latest Clash of Clan strategies provided by our community and the Game Brain team.</p>
    </div>
    <div class="col-sm-4 text-center">
      <h4>Extensive testing</h4>
      <p>All of our guides go through extensive play testing to determine if the strategy is viable for the current meta game.</p>
    </div>
    <div class="col-sm-4 text-center">
      <h4>Contribute</h4>
      <p>Our team encourages the gaming community to help contribute to the site. Reach out to us and help other players.</p>
    </div>
  </div>
</div>

Upvotes: 1

Related Questions