Html 这是CSS中的错误吗？

这听起来像是一个过时的主题，因为由于flex box和grid，没有人仍然使用内联块属性，但我想知道它，我想询问一下

当创建两个div并将它们都指定为显示为内联块，然后在其中一个div中添加任何元素时，结果非常奇怪，其中包含该元素的div将滑到另一个div的底部，减去添加的元素的高度

div{
显示：内联块；
宽度：100px；
高度：150像素；
背景：灰色；
}

正文

显示：内联块值

与display:inline相比，主要区别在于display:inline块允许在元素上设置宽度和高度

此外，对于display:inline块，上下页边距/填充将得到尊重，但是对于display:inline块则不受尊重

与display:block相比，主要区别在于display:inline块不会在元素后添加换行符，因此元素可以位于其他元素旁边

及

对不起，textarea是内联块，但哪一行是正确的， 浏览器认为第二个内联块的底部是线的位置

---

当他去画子对象时，他看到textarea必须是内联的，并将其位置更改为第二个内联块的底部是行的位置，因为它是任何填充，并且它的位置是相对的，所以父div移动到底部只是为了textarea内联

发生这种情况的原因，是因为内联元素的默认值是

基线

然后问题变成了：

内联块

元素的基线是什么？在这里，我们必须区分有无元素：

• 对于具有流内容的元素，例如您问题中的

  左
  div，基线与最后一个内容元素的基线相同。（*）对于
  左
  div，这与内部
  span
  的基线相对应
  
  （*）在设置元素的溢出时，还有一些额外的注意事项，但我将其排除在范围之外

• 对于不包含流内容的元素，例如问题中的

  右侧
  div，基线是元素边距框的底部。对于
  右侧
  div，它对应于div本身的底部

因此，总结一下：您看到垂直移动的原因是元素根据其基线进行垂直对齐，并且有内容和没有内容的元素的基线计算方式不同

要测试这一点，只需尝试向

右侧的
div添加一些文本，您就会看到两个基线现在是如何相同的


div{
显示：内联块；
宽度：100px；
高度：100px；
背景：灰色；
}
文本
其他文本
尝试将最大宽度和最大高度添加到textarea textarea{margin:0；padding:0；width:50px；height:50px；border:0；最大宽度：100%；最大高度：100%；}因为IE还没有死（尚未）
内联块
仍然有它的位置，因为
grid
和
flex
都有缺陷（充其量）即使是最新版本的IE（不是edge），这也不是一个bug，它是垂直对齐，默认情况下，垂直对齐是基线，我并没有完全偏离主题，这正是您需要的答案。你的行为是由于对齐，这是基线，这解释了一切。。我正在添加更多的副本，以便您能够理解这种逻辑行为。阅读副本，您将了解：）作为副本关闭的目的。。我无法在注释中解释此行为，请检查：）-这解释了当两个div都在基线上时的初始状态。我不相信它回答了OP的问题，这就是为什么将div设置为
垂直对齐：top
会删除偏移量。@TemaniAfif-事实上，我认为要完整回答这个问题，尤其是最新形式的问题，需要解释行框是如何构造的。首先将未与顶部和底部行框边缘对齐的项目彼此对齐，然后添加顶部和底部项目。我不确定这些复制品是否真的能做到这一点。不过，我目前没有时间写一个恰当的答案。@Alohci如果我没有错的话，你已经在这里写了@TemaniAfif-我也写了。谢谢。好吧，我承认，我错了，这让我觉得我在重新学习CSS，我过去认为CSS更简单，但现在我明白了这一切背后的基本逻辑，谢谢你们的解释，并对由此带来的不便表示歉意。