outline在firefox和chrome下的渲染差异

这种差异应当在于firefox所理解的outline基于的模型差异

by weiming le

HTML

<div class="test"></div>

CSS

.test {
             position: relative;
             width: 100px;
             height: 200px;
             background: #eee;
             color: #333;
             outline: 1px solid #f60;
         }
         .test:before {
             position: absolute;
             right: -30px;
             bottom: 30px;
             width: 40px;
             height: 40px;
             border: 1px solid #333;
             content:'';
         }