图像周围的白色空间

Question

我有一些文字围绕着一个漂浮在左边的图像.但是文本正对着图像的边界.如何在它周围留出一些空白区域？

目前我已经进入了CSS:

.image {
  float:left
}

和观点:

<% if article.newspic.exists? %> 
        <div class ="image">
        <%= newspic_thumbnail_tag(article) %>
        </div>
    <% end %>

  <%= simple_format(article.body) %><br>

如果我margin-right向图像添加一个,那么文本将从图像下方开始.

Answer 1

在这种情况下添加保证金权利应该有效,但我之前遇到过保证金和浮动的问题,特别是在处理负利润时,但是你也有崩溃利润的问题.这可能是您想要的行为,也可能不是.通常我最终在防守中将浮动内容封装在div中并使用填充代替,因为结果往往更直观.

此外,IE7不会处理大于内容宽度的负边距,因此在这种情况下您必须使用封闭元素.这是该技术的一个例子.

Answer 2

.image {
  padding-right: 10px
}