Как сделать имитацию outline-offset, чтобы поддерживалось это в ie10?

Question

[eugene_d_dev]

Нужно сделать, пусть даже с помощью вложенного блока имитацию outline-offset, т.е. inset outline. Смысл в том, чтобы вертикальные и горизонтальные отступы были абсолютно одинаковыми. Допустим с помощью outline-offset: 2em; Calc также не катит - он не поддерживается в старых версиях webkit. Процентный отступ также не катит, ибо вы сами понимаете, что ориентация блока может быть какой угодно.

Answer 1

[Денис Инешин]

Может так: jsfiddle.net/IonDen/epscfw96

.test {
    position: relative;
    width: 300px;
    height: 100px;
    box-sizing: border-box;
    border: 1px solid #000;
}
.test:before {
    position: absolute;
    display: block;
    content: '';
    top: -10px;
    left: -10px;
    right: -10px;
    bottom: -10px;
    border: 1px dotted #900;
}

Comments

[eugene_d_dev]

блок резиновый с процентными шириной и высотой

[Денис Инешин]

fajjet: ну и что? before от размера подстроится.

[eugene_d_dev]

Денис Инешин: Хм. А разве это валидно не указывать ширину и высоту блока?

[Денис Инешин]

fajjet: конечно, например inline-block или флоат элементы спокойно растягиваются контентом.

[eugene_d_dev]

Денис Инешин: спасибо)