0

我试图以<div>这样的方式对齐 3 个元素，使两个元素彼此相邻，第三个元素在它们下方，从一个延伸到另一个。这是我的小提琴给你看。这也是我的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。

谢谢！

4

3 回答 3

1

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

请看演示，如果那是你想要的，请告诉我

于 2012-11-08T19:25:04.273 回答
0

请更正

#right {
    /*  omit float: right  
    float: right; */
    width: 25%;
    text-align: center;
}

#bottom {
   /* omit position: relative  
   position:relative */
}

用上面的代码替换你的代码，让我知道。

于 2012-11-08T18:54:21.077 回答
0

将样式添加 clear: both;到 id 为“底部”的 div

于 2012-11-08T19:53:12.593 回答