10.10-多个inline行内块元素之间有间隙

项目场景：

---

问题描述：

两个div为inline元素，中间就会有间隙问题出现。

<style>
#id1{
   margin-left: 100px;
   display: inline;
   background-color: #ddd;
}
 #id2{
    display: inline;
    width: 200px;
    height: 300px;
   background-color: blueviolet;
}
</style>
<div id="id">
    <div id="id1">scope1</div>
    <div id="id2">scope2</div>
</div>  

---

---

解决方案：

1.如果两个块用float属性，父级元素就得清楚浮动，可以解决空隙

2.使用css-flex属性 给父级元素加上display:flex, 可以解决

如果不用以上方法，空隙还是存在可以用下面的代码书写方式，代码如下

<div id="id">
    <div id="id1">scope1</div><div id="id2">scope2</div>
</div>

应该是标签之前的制表符 换行 或者空格显示出来，占位了