文字环绕 [CSS]答案

【问题标题】：Text wrap'ing [CSS]文字环绕 [CSS]
【发布时间】：2011-12-21 17:23:09
【问题描述】：

我正在完成我的网站http://centrosokoladine.lt/ 你怎么能看到在中间的左边有一些被文字覆盖的图片，我需要把那个文字换行。图像设置为那些框的背景图像，没有重复左中...

这里是 html 的确切部分：

<div class="turinio"><?php the_content(); ?></div>

还有css：

.vidinis
{
    background-color:#a68e84;
    layer-background-color:#a68e84;
    width: 709px;
    /* height: 306px; */
    align: center;
    padding-top: 17px;
    visibility: visible;
    **background-image: url('http://centrosokoladine.lt/wp-content/themes/sokoladine/grafika/info.gif');
    background-repeat: no-repeat;
    word-wrap: break-word;
    background-position: bottom left;**
    overflow:hidden;
}

我知道在背景图像周围环绕文本是不可能的，所以我在这里寻找其他解决方案，也许我已经尝试为该图像创建单独的 div，但我失败了..

【问题讨论】：

提示：浮动div 就是为此而发明的。（文字将环绕它们。）

标签： css text word-wrap

【解决方案1】：

除非 (1) 你给你的 div 一个 padding-bottom 并且不显示文本 next 到图像，或者 (2) 你给一个padding-left 到你的 div 并且不显示文本 under 图片。

img 元素是执行此操作的常规 (html) 方式。然后，您可以将align 属性添加到该图像。

【讨论】：

但对我来说，如何将图像设置到那个角落有点问题，好吧，我将用户 align="left" 然后呢？那些盒子的大小不固定，我不知道如何将图像向下移动，它会一直留在那个角上并包裹起来..
我理解这个问题，但img 标签（或@Sparky672 sais 的浮动div）是让文本环绕它的方法。为了确保它位于左下角，一种选择可能是测量需要在右侧换行的文本量，然后使用 jQuery 将图像注入所需的字符位置。
@Tauvydas 你想在div 上放置一个 position: relative 和一个 position: absolute;底部：0px； left: 0px 在图片上
我的 div 编码可能不正确，因为我已经尝试了所有方法，它严重破坏了我的设计，而且永远不会换行 :(

【解决方案2】：

float: left;

浮点数可以解决问题。

【讨论】：