diff --git a/common.blocks/icon/icon.styl b/common.blocks/icon/icon.styl index ad7a91620..a5a392d06 100644 --- a/common.blocks/icon/icon.styl +++ b/common.blocks/icon/icon.styl @@ -1,27 +1,27 @@ .icon { - position: relative; - display: inline-block; + text-align: center; + background: 50% no-repeat; /* Hack for correct baseline positioning */ - &:after + &:empty:after { visibility: hidden; content: '\00A0'; } + /* + * Чтобы иконка правильно позиционировалась внутри блочного контекста, + * нужно прописать родителю свойство line-height со значением, равным высоте иконки + */ .image { - position: absolute; - top: 0; - right: 0; - bottom: 0; - left: 0; + margin: -5.18em 0 -5em; /* 0.18 — magic number, empirically found */ - margin: auto; + vertical-align: middle; } } diff --git a/common.blocks/icon/icon.tests/simple.bemjson.js b/common.blocks/icon/icon.tests/simple.bemjson.js index 58161a6e1..63b10c4ee 100644 --- a/common.blocks/icon/icon.tests/simple.bemjson.js +++ b/common.blocks/icon/icon.tests/simple.bemjson.js @@ -49,7 +49,7 @@ 'Inline content: ', { block : 'icon', - content : '' + content : '' } ] } diff --git a/common.blocks/link/link.tests/simple.bemjson.js b/common.blocks/link/link.tests/simple.bemjson.js index 071b0e4c4..4b067928a 100644 --- a/common.blocks/link/link.tests/simple.bemjson.js +++ b/common.blocks/link/link.tests/simple.bemjson.js @@ -44,6 +44,30 @@ url : 'http://example.com/', tabIndex : -1, content : 'out of tab order' + }, + { + block : 'link', + url : 'http://example.com/', + content : [ + { + block : 'icon', + attrs : { style : 'width: 22px' }, + mods : { action : 'download' } + }, + 'with icon' + ] + }, + { + block : 'link', + url : 'http://example.com/', + content : [ + { + block : 'icon', + attrs : { style : 'width: 22px' }, + content : '' + }, + 'with icon + image' + ] } ].map(function(link, j) { link.mods || (link.mods = {});