3

While building a webpage with Bootstrap so far, the navbar looks great! While working with content, I added all CDN links in the header and added the .container class in the body.

But the div seems floating to the left. I have tried to set the container to:

margin: 0 auto;
width: 100%;
display: block;
class{text-align: center}

and many others....

How to solve this issue?

DebRaj
  • 599
  • 4
  • 16
Michaël Thönnissen
  • 129
  • 2
  • 8
  • Can you show us the html and exact css you are using? – melalonso Feb 16 '16 at 16:39
  • 1
    Welcome to Stack Overflow! Questions seeking code help must include the shortest code necessary to reproduce it **in the question itself** preferably in a [**Stack Snippet**](https://blog.stackoverflow.com/2014/09/introducing-runnable-javascript-css-and-html-code-snippets/). See [**How to create a Minimal, Complete, and Verifiable example**](http://stackoverflow.com/help/mcve) – Paulie_D Feb 16 '16 at 16:39
  • well said @Paulie_D, this is important to keep in mind how to ask a question in such a place. – Murad Hasan Feb 16 '16 at 16:41
  • 1
    http://stackoverflow.com/questions/18153234/center-a-column-using-twitter-bootstrap-3 – melalonso Feb 16 '16 at 16:43

3 Answers3

0
<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <title>Center Div in Bootstrap</title>
        <link rel="stylesheet" href="linkToCSS" />
    </head>
    <body>
        <div class="container-fluid">
            <div>
                <div class="row">
                    <div class="part " style="float: none; margin: auto;">
                        //your content goes here
                    </div>
                </div>
            </div>
        </div>
    </body>
</html>
Patrick Wambua
  • 87
  • 2
  • 9
0

You can add flexbox to your bootstrap container. You don't need to write any extra CSS for bootstrap if you will use pre-written bootstrap classes. As below;

<div class="container d-flex justify-content-center">...</div>
Lily
  • 1
  • 3
-2
<div align="center">
  Your body...
</div>
luk492
  • 350
  • 3
  • 15