0

我试图让两个 div 框彼此相邻并且具有相同的高度作为百分比,以便它们在两个不同尺寸的不同屏幕上正确显示。

当我运行代码时,屏幕似乎有不同的大小。

这是我的代码:

 <a href="https://unesco.csod.com/catalog/SearchAdvanced.aspx?dept_id=538">
<div style="border-radius: 25px; width: 40%; height: 56%; text-align: center; color: #ffffff; margin-left: 7%; display: inline-block; background-color: #80b280; flat: left;"><strong><span style="padding-top: 20px; font-size: 20px;"><br />
IT Training Resources</span><br />
</strong>
<br />
<span style="font-size: 13px;"><font face="Tahoma">A comprehensive resource page which includes video tutorials on a variety of Microsoft products<br />
</font>
</span></div>
</a>
<a href="https://unesco.csod.com/catalog/SearchAdvanced.aspx?dept_id=533">
<div style="border-radius: 25px; width: 40%; height: 56%; text-align: center; color: #ffffff; margin-right: 7%; float: right; display: inline-block; background-color: #5cadff;"><strong><span style="font-size: 20px; margin-top: 20%;">
<br />
Career Tutorials Library</span>
</strong>
<br />
<br />
<span style="font-size: 13px;"><font face="Tahoma">Rapid courses for all staff to move ahead in their career</font><br />
</span></div>
</a>

这是一个小提琴:http: //jsfiddle.net/eKpF9/

4

2 回答 2

3

您需要有一个“全局” div,其中包含其他两个 div 并定义了高度,以便浏览器可以执行该值的百分比。

<div style="height:500px">
    rest if your code
</div>

如果您不想为 div 定义固定高度,可以使用 javascript 属性 screen.height 来获取屏幕的高度,然后将其设置为 div 高度。

于 2013-08-13T14:28:55.757 回答
1

Easy peasy:你在右边的盒子里少了一个 br。浮动元素没有高度。你也拼错了一次 float :)

于 2013-08-13T14:31:33.643 回答