Question

您好，

我有以下HTML：

<div class="controlTitleContainer ">
    <label for="test">Titel</label>
    <div class="q">&nbsp;</div>
</div>

CSS看起来像这样

.controlTitleContainer .label
{
    font-size:              0.94em;
    color:                  #778899;
    display:inline;
}

.controlTitleContainer .q
{
    background-image:       url("Images/Common/Icons/questionMark_15x14.png");
    height:                 14px;
    width:                  15px;
    float:left;
}

问题是div会放在标签的左边而不是右边吗？为什么呢？

我试图将div切换到跨度但没有成功。此外，如果我将div更改为img intead然后它将工作但是有一些无法使用div元素删除的无边距。

请求建议

编辑1：现在应该修复问题中的混淆，对不起。

MySolution：我创建了两个div元素（一个用于文本，一个用于图标），然后将float设置为左侧。

Answer 1

你很困惑。您谈论问题标题中的IMG，然后在代码中显示SPAN，然后在文字中谈论DIV。

但我想这三个代码都会在您的代码中引用SPAN，因为您确实为SPAN元素设置了背景图片。

解决方案

反正。根据您的CSS，您的span会浮动。如果您在样式表中删除以下行，span将显示在label右侧：

float: left; /* <- remove this */

修改：我认为由于这种混淆，您的问题被忽略了。如果您希望社区帮助提供详细的答案，您可以做的最少的事情就是花时间以您期望的相同数量的谨慎来制定您的问题。

Answer 2

您不希望图片位于标签的右侧吗？您已指定float: left;。您可能还想在第一行的css代码中将.label更改为label。

Answer 3

您可以使用“CSS：after Selector”

链接：http://www.w3schools.com/cssref/sel_after.asp

Answer 4

浮点数可能很棘手...我只是确保标签是内联或内联块，并且您的图像或图像容器也是内联或内联块。然后将它们作为文本排成一行。 Yeay！

标签元素后的HTML img

4 个答案:

解决方案