html - CSS 中的一个框内的 2 个框

Question

我希望有人能为我提供一个有效的 css，它可以将 2 个盒子放在一个盒子里。 就像我给的图片一样

CSS

<style type="text/css">
            #adbox {
                width: 602px;
                height: 250px;
                border-width: 0;
                border-color: red;
            }
            #adbox .adbox1 {
                width: 300px;
                height: 250px;
                border-width: 0;
                border-color: red;
                }
            #adbox .adbox2 {
                width: 300px;
                height: 250px;
                border-width: 0;
                border-color: red;
        }
    </style>

HTML

<div align=center><div id="adbox">
<div class="adbox1">
<img src="foobar1.jpg" border="0" />
</div>
<div class="adbox2">
<img src="foobar.jpg" border="0" />
</div>
</div></div>

Answer 1

我猜你想像你提供的图片那样对齐方框。

您可以使用此 css 执行此操作:

#adbox {
  width: 600px;
  height: 250px;
  border: 1px red solid;
}

#adbox .adbox1, #adbox .adbox2 {
  width: 300px;
  height: 250px;
  float: left;
  outline: 1px red solid;
}

示例:http://tinkerbin.com/5MAX3Mt2