给<li>一个width，再给一个float: left;

还有你CSS里的menu-list在你的HTML里都没有看到。

贴了代码，你看一下，不知道你是要这个效果吗？(。＾▽＾)

<div class="menu-list">
	<ul>
            <li>
                <div class="menu-title">
                    <h4>Voluptate cillum fugiat.</h4>
                    <p>Cheese, tomato, mushrooms, onions.</p>
                </div>
                <div class="line"></div>
                <div class="price">$50</div>
            </li>
            <li>
                <div class="menu-title">
                    <h4>Voluptate cillum fugiat.</h4>
                    <p>Cheese, tomato, mushrooms, onions.</p>
                </div>
                <div class="line"></div>
                <div class="price">$50</div>
            </li>
            <li>
                <div class="menu-title">
                    <h4>Voluptate cillum fugiat.</h4>
                    <p>Cheese, tomato, mushrooms, onions.</p>
                </div>
                <div class="line"></div>
                <div class="price">$50</div>
            </li>
	</ul>
</div>

.menu-list{
    width:1100px;
    margin:0 auto;
    }

.menu-list li{
    float: left;
    width: 520px;
    margin-bottom: 64px;
    }