css - 尝试对齐 DIV 元素失败

Question

我正在尝试对齐 3 <div>两个元素相邻，第三个元素在它们下面，从一个元素延伸到另一个元素。 Here是我的 fiddle 给你看。这也是我的 CSS:

<style type="text/css">
body {
    background-image: url(https://www.dropbox.com/s/ri903jtb93a5168/background.jpg);
    background-attachment:fixed;
    font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
    background-repeat:no-repeat;
    background-position:center;
    padding-right: 20%;
    padding-left: 20%;
    padding-top: 19%;
}
#left {
    float: left;
    width: 25%;
    text-align: center;
}
#right {
    float: right;
    width: 25%;
    text-align: center;
}

#bottom {
    position:relative
}

.lists {
    background: transparent;
    width: 268px;
    padding: 5px;
    font-size: 16px;
    border: none;
    height: 34px;
    -webkit-appearance: none;
}
</style>​

有什么想法吗？我是新手，正在尝试掌握 CSS。

谢谢!

Answer 1

我有点改变了你的代码， 我在左右 div 之后添加了 clear:float。

请看Demo , 如果那是你想要的，请告诉我