需要不占布局的边框?
box-shadow 就可以
Try this:

 #main {
    width: 150px;
    height: 150px;
    position: relative;
    margin: 50px;
    box-shadow: 0 0 0 1px #009fee;
}

http://codepen.io/anon/pen/KpKgXx

针对 Firefox 使用 outline-offset 属性来实现~

为什么不使用border？

是否使用border可以很好的实现你的需求哪？

 

 #main{
width:150px; height:150px; position:relative; margin:50px; 
border:1px solid #009fee;//这里修改为border
}

如果实在需要使用outline

那么可能需要嵌套div开解决这个问题。(如果border不行的话，继续追加代码)