CODEWITHSUNDEEP
htmlcsstwitter-bootstraptwitter-bootstrap-3
Jordan Axe
Jordan Axe

Reputation: 3923

Bootstrap page is being pushed to the left?

I've just migrated to bootstrap 3 and apparently my page is being pushed a little to the left. I've commented out EVERYTHING however still around 20px or so are being pushed to the left (out of the screen). Anyone experienced this before? I'm running a pretty much clean ASP.NET MVC4 site (with bootstrap and jquery only) so what could be causing this?

This is literally all my code:

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width" />
    <title>Index</title>
    <link href="/Content/bootstrap/bootstrap.css" rel="stylesheet"/>  
</head>
<body>
<div class="row">
    <div class="well col-lg-12 col-md-12 col-sm-12">
        <h2>Latest added</h2>
    </div>
</div>
</body>
</html>

Upvotes: 0

Views: 140

Answers (2)

Theresa Smillie
Theresa Smillie

Reputation: 38

Possible css file issue. Do you use developer tools in browsers? -OR- unclosed div tag which you can verify by going to: http://validator.w3.org/

I always put a div class="container" around all rows but not sure if that would cause it to shift.

Upvotes: 0

Carol Skelly
Carol Skelly

Reputation: 362630

You could put the .row inside a container..

<div class="container">
<div class="row">
    <div class="well col-lg-12 col-md-12 col-sm-12">
        <h2>Latest added</h2>
    </div>
</div>
</div>

If you want it to be 100% width, use col-md-12..

<div class="col-md-12">
<div class="row">
    <div class="well col-lg-12 col-md-12 col-sm-12">
        <h2>Latest added</h2>
    </div>
</div>
</div>

http://bootply.com/87853

Upvotes: 2

Related Questions