这是一个CSS问题,使我无所适从。下面是我当前拥有的代码,我希望描述文本在蓝色框的右侧(即标题下方),但要使其继续位于``按钮''下方。我尝试了各种组合,但是它们要么从当前位置开始,要么在标题下方,但以其宽度缩进。
任何帮助,不胜感激
<html>
<head>
<style>
body { background-color: #fff; color: white; }
.outer { width: 850px; height: 400px; background-color: #000; }
.logo {float: left; width:150px;height:150px;background-color: #00f;}
.button {float: right; height: 60px; width: 80px; background-color: #f00; }
.title { font-size: 60px; float:left;}
.desc {clear:both;}
</style>
</head>
<body>
<div class="outer">
<div class="head">
<div class="logo">oo</div>
<div>
<div class="title">Title</div>
<div class="button">button</div>
<div class="desc">description text description text description text description text description text description text description text description text description text description text description text description text</div>
</div>
</div>
</div>
</body>
</html>
文本应位于上图中白色框的位置。
最佳答案
现在应该很简单吧?只需将其浮动到左侧并为其设置宽度即可...
Demo
的CSS
.desc {
float: left;
width: 650px;
padding: 10px;
}