Html 中置垫子

我是新手，请原谅我的粗鲁

我希望两个div居中，它们之间留有空间，这样它们就不会接触了

CSS-

#div1 {
margin: 0px auto 0px;
float: left;
height: 500px;
width: 339px;
}
#div2 {
margin: 0px auto 0px;
float: left;
height: 500px;
width: 400px;
}

HTML-

<div id="div1">
<p>Image 339 x 500 to go here</p>
</div>

<div id="div2">
10-17-20 - Toronto, Ontario - Massey Hall<br />
11-21 Birmingham, England - National Indoor Arena<br />
11-22 Manchester, England - 02 Apollo Manchester<br />
11-24 Manchester, England - 02 Apollo Manchester<br />
11-25 London, England - The 02 Arena</p> 
</div>

图339 x 500要转到此处

10-17-20-安大略省多伦多-梅西厅

11-21英国伯明翰-国家室内竞技场

11-22英国曼彻斯特-02阿波罗曼彻斯特

11-24英国曼彻斯特-02阿波罗曼彻斯特

英国伦敦11-25号02竞技场

左边
正确的
#包装{宽度：90%；边距：0自动；}
#左{浮动：左；宽度：48%；右边距：1%；}
#右{浮动：右；宽度：48%；左边距：1%；}

您想让它们并排放置还是放在两个不同的“行”中，但在整个页面居中？并排，居中将“两个div”放置在全局div中，并带有宽度和边距：自动提示：如果您没有设置高度的具体原因，请不要。使用像素的尺寸也是如此。

<div id="wrapper">
  <div id="left">left</div>
  <div id="right">right</div>
</div>

#wrapper {width:90%;margin:0 auto;}
#left {float:left;width:48%;margin-right:1%;}
#right {float:right;width:48%;margin-left:1%;}