css - 用空格并排显示 2 张图像 (Css)

Question

我在我的网页中并排显示 2 张图片。我试图在两张图片之间留出一个空间，但我做不到。我使用 CSS 并排显示图像。

这是我的 Html 代码:

 <div id="divCenter">

       <img src="Company Logo.jpg" alt="Company Logo" style="width:150px;height:150px" id="divIDOne"/>

          <%-- Code for the motion image --%>



      <object type="application/x-shockwave-flash" data="animation.swf" width="719" height="174" id="divIDTwo">
      <param name="movie" value="animation.swf" />
      </object>

       </div>

这是我的 CSS 代码:

 #divCenter {
    text-align: center;
 }

 #divIDOne {
     margin-right: 200px;
  }

 #divIDTwo {
     margin-left: 300px;
 }

这是它显示的内容:

问你可以看到2张图片之间没有空格。我该如何解决这个问题？

谢谢你的时间

Answer 1

代替 text-align:center; 使用 margin:0px auto; 并指定宽度和高度属性。 尝试这个。 HTML

<div id="divCenter">
       <img src="#" alt="Company Logo" style="width:150px;height:150px" id="divIDOne"/>
<!-- <%-- Code for the motion image --%> -->
      <object type="application/x-shockwave-flash" data="animation.swf" width="780" height="174" id="divIDTwo">
      <param name="movie" value="animation.swf" />
      </object>
</div>

CSS

#divCenter {
  margin:0px auto;
  width:960px; 
  height:auto;
  padding:10px;
}

 #divIDOne {
     margin-right: 0px;
 }

 #divIDTwo {
   margin-left: 20px;
 }

Fiddle