firefox和chrome的outline表现不同

Question

我在codepen上面放了测试代码：http://codepen.io/fonglezen/pen/gpOreQ
outline在firefox和chrome的表现不同。
chrome的outline是元素盒子的宽高，
但是firefox的是，在所有元素的最外围！
问：有没有什么hack方法，让firefox的outline的表现和chrome的一致！！

Answer 1

为什么不使用border？是否使用border可以很好的实现你的需求哪？#main{width:150px;height:150px;position:relative;margin:50px;border:1pxsolid#009fee;//这里修改为border}如果实在需要使用outline那么可能需要嵌套div开解决这个问题。(如果border不行的话，继续追加代码)