<!DOCTYPE html><html><head><title>Width issue</title><style type="text/css">body { margin: 0;}#left { width: 50%; background: lightblue; display: inline-block;}#right { width: 50%; background: orange; display: inline-block;}</style></head><body> <div id="left">Left</div> <div id="right">Right</div></body></html>JSFiddle：http : //jsfiddle.net/5EcPK/上面的代码试图将#left div和#right div并排放置在一行中。但是，正如您在上面的JSFiddle URL中所看到的，情况并非如此。我能够解决将div之一的宽度减小到49％的问题。参见http://jsfiddle.net/mUKSC/。但这不是理想的解决方案，因为两个div之间出现很小的间隙。我能够解决问题的另一种方法是通过同时浮动两个div。参见http://jsfiddle.net/VptQm/。这很好。但是我最初的问题仍然存在。为什么当两个div都作为内联块元素保留时，它们却不能并排放置？
3 回答
慕桂英3389331
TA贡献2036条经验 获得超8个赞
使它们阻塞而不是内联块。这将使div忽略它们之间的空间。
display:block;
或删除标签之间的空间
<div id='left'></div><div id='right'></div>
或添加
margin: -1en;
到div之一以减轻单个渲染空间占用的空间。
- 3 回答
- 0 关注
- 600 浏览
相关问题推荐
添加回答
举报
0/150
提交
取消