Html 将两个div放在同一行上

更新：我得到了答案…非常感谢Brad（在评论中）

更新2：我不知道如何在评论中给出最好的答案

更新3：我给了迈克尔最好的答案，因为布拉德爵士并没有给答案是答案部分

我正在努力让两个div在同一条线上，但徒劳无功

span.tab{
填充：0 50px；/*或所需空间*/
}
.第23分部
{
显示：内联
浮动：左；
}
.span.tab
{  
显示：内联
浮动：左；
}
.topdiv1
{
显示：内联
浮动：左；
}
.topdiv3
{
显示：内联
浮动：左；
}

我想不出哪里出了问题。请提供帮助

<div style="display:inline-block; margin-right:50px"><img src="http://i.udm4.com/mac/48/163/163483.png" /></div>
<div style="display:inline-block;"><img src='http://i.udm4.com/mac/48/163/163483.png'/></div>

或

或

---

您可以用更少的CSS获得相同的结果，虽然这可能不是你想要的解决方案

img {
    margin-right:50px;
    float:left;
}

---

编辑：当然，您需要使

img

选择器更具体；否则，您将在页面上设置所有

元素。

您可以用更少的CSS获得相同的结果，虽然这可能不是你想要的解决方案

img {
    margin-right:50px;
    float:left;
}

---

编辑：当然，您需要使

img

选择器更具体；否则，您将设置页面上的所有

元素。

您有多个语法错误

在HTML和CSS中，用一个

这个。字符引用类，而不是ID。要引用ID，需要使用#。或者您可以将id=“x”切换到class=“x”，而不使用css

您的div结构嵌套不正确。下面的代码解决了您的问题

span.tab{
填充：0 50px；/*或所需空间*/
}
#topdiv3{
浮动：左；
}
#第23课{
浮动：左；
}

您有多个语法错误

在HTML和CSS中，用一个

这个。字符引用类，而不是ID。要引用ID，需要使用#。或者您可以将id=“x”切换到class=“x”，而不使用css

您的div结构嵌套不正确。下面的代码解决了您的问题

span.tab{
填充：0 50px；/*或所需空间*/
}
#topdiv3{
浮动：左；
}
#第23课{
浮动：左；
}

您尝试过设置宽度吗 像

---

您尝试过设置宽度吗 像

首先，您有语法错误。您三次错过显示的分号：inline。（应该是display:inline；）此外，如果在HTML中使用ID，但在CSS中引用类，则会出现进一步的语法错误。其次，您的div ID为

div

，但您的样式引用的类为

。div

（怎么样？），非常感谢！！顺便说一句isnt是“.”用于“id”和#用于“class”不，它正好相反，这就是代码无法工作的原因。你的div布局也有错误，请看我的答案。首先你有语法错误。您三次错过显示的分号：inline。（应该是display:inline；）此外，如果在HTML中使用ID，但在CSS中引用类，则会出现进一步的语法错误。其次，您的div ID为

div

，但您的样式引用的类为

。div

（怎么样？），非常感谢！！顺便说一句isnt是“.”用于“id”和#用于“class”不，它正好相反，这就是代码无法工作的原因。你的div布局也有错误，请看我的答案。实际上我需要一个div包装，因为。我正在创建一个响应性设计，当屏幕宽度变小时，我需要隐藏第一个div…非常感谢你的努力。嘿，我得到了ans…非常感谢，实际上我需要一个div包装，因为我正在创建一个响应性设计，当屏幕宽度变小时，我需要隐藏第一个div…非常感谢你的努力。嘿，我得到了答案。非常感谢，因为他指定他需要像这样嵌套div。他指定他需要像这样嵌套div。他已经有float:left了。他的问题不在于规则本身，而在于他到处都有语法错误。我知道这一点。我只是简单地指出了另一种使用更少CSS的解决方案。有时，解决问题的有效方法是认识到可能有更优雅的解决方案。他在一条线上要求两个div。当然，根据他的代码，看起来他指的是一行上的两个img。他已经有了float:left。他的问题不在于规则本身，而在于他到处都有语法错误。我知道这一点。我只是简单地指出了另一种使用更少CSS的解决方案。有时，解决问题的有效方法是认识到可能有更优雅的解决方案。他在一条线上要求两个div。当然，根据他的代码，他指的是一行两个IMG。

img {
    margin-right:50px;
    float:left;
}

<div id='topdiv1'>

<div id='topdiv3'>
    <img src='http://i.udm4.com/mac/48/163/163483.png'/>
</div><!-- end topdiv3 -->

<div id='div23 '>
    <img src="http://i.udm4.com/mac/48/163/163483.png" />
</div><!-- end div23 -->

<span class="tab"></span>
</div><!-- end topdiv1 -->

span.tab{
    padding: 0 50px; /* Or desired space*/
}

#topdiv3 {
    float: left;
}

#div23 {
    float: left;
}

<div>

<div style="float:left;width:10%"><img src='http://i.udm4.com/mac/48/163/163483.png'/></div>
<div style="float:left;width:10%"><img src='http://i.udm4.com/mac/48/163/163483.png'/></div>

</div>