html - 将2个div放在同一行

标签 html css

<分区>

更新:我得到了答案...非常感谢 Brad(在评论中)

更新二:不知道怎么在评论里给出最佳答案

更新 3:我正在给迈克尔最好的答案,因为布拉德爵士没有给出答案是答案部分

我正在努力让 2 个 div 在同一行上,但徒劳无功

Jsfiddle

 <br /><div id='topdiv1'><div id='topdiv3'><div id='div23 '>
<img src="http://i.udm4.com/mac/48/163/163483.png" /></div><span class="tab"></span>
 <img src='http://i.udm4.com/mac/48/163/163483.png'/></div></div>



span.tab{
padding: 0 50px; /* Or desired space*/
}
.div23 
{
display: inline
    float:left;
  }
   .span.tab 
{  
   display: inline
    float:left;
}
   .topdiv1 
  {
   display: inline
float:left;
  }
.topdiv3
  {
        display: inline
          float:left;
   }

我不知道我哪里错了.plz help

最佳答案

您有多个语法错误。

在 HTML 中你有,在 CSS 中你用 . 引用 x。

.字符指的是一个类,而不是一个ID。要引用 ID,您需要使用 #。或者您可以将 id="x"切换为 class="x"并单独保留 css。

您的 div 结构也嵌套不当。以下代码解决了您的问题。

http://jsfiddle.net/LgADB/4/

<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;
}

关于html - 将2个div放在同一行,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/15119202/

上一篇:javascript - 范围 slider 控制

下一篇:css - 在背景颜色之上应用渐变 CSS

相关文章:

JavaScript 动画没有按顺序运行?

javascript - HTML5 : canvas and image size

javascript - 自动播放代码不适用于Chrome和Firefox

javascript - 从输入控件中检索特定模式类型的子节点

html - 绝对定位导致带有图像的水平滚动条

html - 如何将悬停叠加文本固定到图像

javascript - 是否可以在 DIV 上添加事件监听器?

html - 我们可以转义用作相对单位的 % 符号吗

javascript - 从html中调用jquery函数进行解析

jquery - 窗口大小的 setInterval + jQuery CSS 动画