Question

我正在制作一套＆＃34;步骤＆＃34; div通过页面显示进度，我希望这两个div相互齐平，但它们之间有几个像素。我认为margin和padding 0px会修复它，但它什么都不做。

我想在不向CSS添加减号属性的情况下实现此目的

CSS：

.step {
    width: 20px;
    height: 20px;
    background: white;
    border: 1px red solid;
    display:inline-block;
    padding:0px;
    margin:0px;
}

.line {
    height:1px;
    width:20px;
    background:#717171;
    border-bottom:0px solid #313030;
    display:inline-block;
    padding:0px;
    margin:0px;
}

HTML：

<div class="step"></div>
<div class="line"></div>

Answer 1

将您的标记更改为：

<div class="step"></div><!--
--><div class="line"></div>

由于内联块元素在两者之间留下了空间，所以这可能是一个黑客攻击。

您可以看到参考here并附上说明。

或

你可以在一行中制作

<div class="step"></div><div class="line"></div>

Demo

Demo 2

Answer 2

以这种方式写http://jsfiddle.net/aLs2b/3/

<div class="step"></div><div class="line"></div>

在没有减去CSS属性的情况下触摸两个div

2 个答案:

Demo

Demo 2