center Bootstrap content with CSS

Question

I am trying to make the contents of the Bootstrap inspired grid (Fiddle below) to center when the browser width is maximized. I would like to see the 4 and 5 blocks center in their screen. What CSS could I apply to make this happen?

<!DOCTYPE html>
<html lang="en">
<head>
    <title>Scaffolding · Bootstrap</title>
    <link href="http://twitter.github.com/bootstrap/assets/css/bootstrap.css" rel="stylesheet">
    <link href="http://twitter.github.com/bootstrap/assets/css/docs.css" rel="stylesheet">
</head>
<body>
    <div class="row">
        <div class="span9">
            <div class="row show-grid">
                <div class="span4">
                    4</div>
                <div class="span5">
                    5</div>
            </div>
        </div>
    </div>
</body>
</html>

Fiddle

micha · Accepted Answer · 2012-12-17 22:41:28Z

1

Give your body tag the class container. This should center the div with the class row.

<body class="container">

answered Dec 17, 2012 at 22:41

micha

49.8k16 gold badges75 silver badges80 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

center Bootstrap content with CSS

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related