Question

我想把两个并排放在另一个上（我有三个）这是我的代码：

<div class=Mheader >
<div class=theader>
Meine Route !
</div>
<div class=imgcss>
 <img src="Images/Route1.png" width=600 height=100 />
</div>

但图像总是在文本下面。我可以解决这个问题吗？我的CSS是：

.Mheader
{
    font-family: 'Trebuchet MS';
    font-size: larger;
    font-weight: bold;
    font-style: italic;
    text-transform: capitalize;
    color: #FFFFFF;
    background-color: #008800;
    width: auto;
    height: 100px;
}
.theader
{
    font-family: 'Franklin Gothic Demi';
    font-size: xx-large;
    font-weight: bold;
    font-style: italic;
    line-height: normal;
    width: 250px;
    text-align: left;
    height: 100px;
}
.imgcss
{
    text-align: right;
    width: 600px;
}

Answer 1

您必须在float:left;和.theader类

中使用.imgcss

Answer 2

向他们提供float。写得像这样：

.imgcss,
.theader{
 float:left;
}

Answer 3

仅float: left .theader和.imgcss元素，并确保父元素至少为850px大（600px + 250px） < / p>

.imgcss, .theader{
    ...
    float    : left;
}

.Mheader {
    ...
    min-width : 850px;
}

Answer 4

我假设您希望绿色标题跨越屏幕，并且图像/徽标应该浮动在此标题内的右侧。为此：

关闭.Mheader。缺少</div>
将float: left添加到.theaeder。保留width: auto
将float: right添加到.imgcss

在此处观看演示：

http://jsfiddle.net/mtbwD/

将两个<div>并排放置</div>

4 个答案: