html - 如何不将文本环绕在 DIV 周围？

Question

我想我彻底搜索了这个网站，但找不到我的问题的答案；我也认为这很简单，但是经过几个小时的困惑之后，我已经放弃并决定寻求帮助......

这是我的问题；我有一个 DIV，里面有两个 DIV；第一个 DIV，“snapshot”包含使用 websnapr.com 返回网站 snapsshpt 的脚本；快照大小为 202 x 150，因此我将该 DIV 的宽度定义为 230 像素。第二个 DIV，“描述”，应该显示在该快照的右侧，它包含一些文本。我的问题是最后的文本围绕“快照”流动，即在它下面，我希望它保持一致，始终在 DIV“快照”的右侧，而不是在他下面。

因此，您看到第 1 行到第 10 行没问题；我希望第 11 行和第 12 行以及其余文本在第 1-10 行下方对齐，而不是在快照下方对齐!

代码如下:

    <div class="entry">
  <h2 align="center">Some title here...</h2>
  <div id="snapshot"><script type="text/javascript">wsr_snapshot('some link here', 'some pass here', 's');</script></div>
  <div id="description"><p>Line 1<br>Line 2<br>Line 3<br>Line 4<br>Line 5<br>Line 6<br>Line 7<br>Line 8<br>Line 9<br>Line 10<br>Line 11<br>Line 12<br></p>
<p align="left">Link:<br>
    <a href="#" target="_blank">some link here</a></p></div>
</div>

这是这些 ID 和类的 CSS:

.entry {margin:0 0 20px 0; border:2px solid #fff; background:#e6e6e6 url(images/bg.png) repeat-x; color:#333; padding:10px 10px 0 10px; min-height:200px; height:auto !important; height:200px; }

#snapshot {float:left; width:230px;}
#description {display: block; margin-left:240 px;}

我尝试了这两个 DIV 的各种属性 - 显示、清除、溢出等，但都无济于事；希望有人能阐明我在这里缺少的东西......

Answer 1

啊哈:在 #description 的 margin-left 规则中，您在 240 和 px 之间有一个额外的空间。

以下works :

#description {display: block; margin-left:240px;}