解决 IE 中 CSS 个问题的正式流程

Question

有没有办法像 Chrome 那样在 Internet Explorer 代码检查器中查看 margin/padding/block 边界？

解决 Chrome 和 IE 之间的显示差异并不容易，因为在代码检查器中选择元素时，IE 在视口中没有提供视觉辅助。

Edit：我在 IE11 的 Dom Inspector 的右侧找到了 Layout 选项卡，但是我无法轻易看出 this page 上出现以下差异的原因；

Chrome:

Internet Explorer：

请注意 Click Here 文本在 IE 中放错了位置？

我不知道解决 IE 中 CSS 问题的正式流程。

Edit2: 我现在看到文字Click Here后面的图片在IE里是wider/taller,这会将深蓝色框向下移动，导致文本显示在深蓝色框的顶部。

Answer 1

F12，dom 资源管理器，在右侧面板上选择“配置”选项卡（第 3 个）:)

Answer 2

这似乎解决了问题，我的 chrome 和 IE11

也有同样的问题

.btn-4 p#more-btn {
    color: #FFFFFF;
    font-size: 12px;
    margin: 66px 7px !important;
}

请注意，不建议使用 !important。您是否为您的 CSS 使用重置或同等功能？

formal process for troubleshooting CSS issues in IE