Horizontal Centered Menu in CSS?

Question

I want to make a horizontal centered menu. I have tried using things like text align center and margin auto but can\'t get them to work. I do not want to use a table.

<

Answer 1

You need to set the display property on the LIs to inline-block and set the text-align on the UL to center.

HTML:

    

        

            

                
footer info 1
                
footer info 2
                
footer info 3
            
        
    

CSS:

footer {
    background:#fdd;
}
div.row {
    background: #dfd;
}
ul {
    background: #ddf;
    list-style: none;
    margin: 0;
    padding: 0;
    text-align: center;
}

li {
    display: inline-block;
    background: #fff;
    margin: 0.5em;
    padding: 0.5em;
}

http://jsfiddle.net/ghodmode/h2gT3/1/