Question

我有两个内联块元素，它们之间有一个我似乎无法控制的边距。

如何让浅蓝色元素触及以下JSFiddle中的绿色元素？

http://jsfiddle.net/oregontrail/XvBa7/1/

.indicator {
    display:inline-block;
    width:100px;
    height:50px;
    text-align: center;
    background: PaleTurquoise;
    vertical-align: top;
}

.handle {
    display:inline-block;
    width: 50px;
    height: 50px;
    text-align: center;
    background: limegreen;
}

Answer 1

以下是一些可能的解决方案：
Fighting the space between inline block elements

内联块元素被视为单词，因此受到字间距的影响。

Answer 2

将display:inline-block替换为float:left中的.indicator和.handle

Answer 3

我在这里回答了类似的问题：CSS placing 3 blocks next to each other

解决方案是使用包装器并设置font-size: 0然后在元素中重置它或消除html中div之间的任何空格。请参阅帖子以获得更深入的答案

内联块元素之间的边距

3 个答案: