Can't get the <li>S inside the footer div



I'm doing the Build a resume exercise and I can't get the bottom unordered list to be on the same line.

It doesn't go inside the footer (it's below) even though I wrote the the display: inline in the css.

Here is the code:

<div id="footer">
                <li>Contact</li><li> </li><li> </li>
                <li>Ask my picture</li><li> </li><li> </li>
                <li>Autograph?</li><li> </li><li> </li>

and the CSS

text-align: center;
border:2px solid #D45798;
height: 50px;
padding: 1px;
clear: both;


footer ul

display: inline-block;
margin: 10px 40px;
padding: 0;


footer li

    font-family: Cursive;
    font-weight: bold;
    font-size: 12px;
    color: #D45798;
    list-style: none;


I finally managed to get what I wanted but it was after trying several things randomly and refreshing the browser. I'd be glad if someone could correct the CSS :smile:

I hope you can help me with this.

Oh and please ignore the content of the resume. I was just trying random things :smile:


if you edit/update your question, leave a reply so i get a notification. please post full html + css code and take the following steps to make it visible:

i would like to run the code, no image please


I edited my post :smile:


Looks good, what exactly is the problem?


I have the feeling that putting display:inline everywhere isn't the right thing to do :confused:
I mean, it looks like my CSS works but it's super messy.