Question: On ([my site](http://floor123test.weebly.com)) I would like to place the menubar in the center of the page.
Here the code of my menubar:

```
#navigation {
    padding-bottom: auto;
    width: 960px;
    margin: auto;
    text-align: center;
    text-transform: uppercase;
    overflow: hidden;
    font-family: 'Raleway', sans-serif;
    font-size: 13px;
    background-color: #DDDDDD;
    border: 0px solid;
    border-radius: 15px;
    color: #000000;
    display: inline-block;
}

```

Thanks in advance for helping me! :)

Answer: 
Switch display: inline-block; to display: block;
I guess you need to understand something about block and inline-block elements.

Block elements , if sized and smaller than page/container can basicly; be centered with margin:auto;.

Inline-block element behaves like text and can follow text-align value.

To center your menu , you have then 2 options:
 `margin:auto;` with a block formating, you need then just to remove your inline-block display wich does:

```
#navigation {
padding-bottom: auto;
width: 960px;
margin: auto;
text-align: center;
text-transform: uppercase;
overflow: hidden;
font-family: 'Raleway', sans-serif;
font-size: 13px;
background-color: #DDDDDD;
border: 0px solid;
border-radius: 15px;
color: #000000;
}

```

or 
`text-align:center;` from its parent if as an inline boxe. Wich would be here :

```
.bg-wrapper {
text-align:center;
}

```

If inline-block was here used to trigger some special layout , like to hold floatting elements, you could here turn `display:block` into `display:table;`.

doei