What is the main difference between inline and inline-block elements?

.box {
    display: inline-block;
    width: 100px;
    height: 100px;
    background: red;
}

How will multiple .box elements appear?

Which display value is best for creating horizontal navigation menus?

span {
    display: inline-block;
    width: 50px;
    height: 50px;
    background: blue;
}

Will this CSS work on a span element?

What is a common issue with inline-block elements?