weranda: Нагуглил: называется такая форма "squircle" (квадруг по-русски, нечно среднее между квадратом и кругом). Варианты реализации гуглятся по запросу "CSS3 squircle". Но сам CSS3 так не умеет, либо извращения с псевдоэлементами, либо маски, либо SVG.
Так и представляю несчастного верстальщика, которого дизайнер тыкает новом в ваш ответ. Верстальщик в итоге переписывает 100500 строк стилей на портале, чтобы вся страница у юзера стала "чуть прозрачной". Что характерно, картинки в статьях и на бекграунде "чуть прозрачными" становиться не захотят, что добавит гемора верстальщику :)
Сергей Шилов: Допустим у вас есть <div>, вы ему задали ширину 12vh. vh - это 1% от высоты окна. Представим, что окно у вас высотой 1080px (типа у нас fullHD). Пересчитываем в пиксели: 1080px * 12vh / 100% = 129.6px Браузер округлит до 130px.
Видимо у вас ширины обоих блоков округляются в большую сторону, отсюда разница в 2 пикселя.
SM: Я читал внимательно, но требований к браузерам не увидел. А ведь это первое, что вам надо было бы указать. Про вторую строку опять же ни слова: откуда я знаю, может у вас nowrap строит или есть минимальная ширина контента (320px к примеру для мобил), или допустим размер шрифта тоже адаптивный...
Так то если ИЕ идёт лесом, то флексы конечно удобней всего. Опять же display: table; подошел бы, но нужно ещё один элемент добавлять в разметку.
SM: Так потрудитесь описать условия, при которых должно работать, подробней. При тех условиях, что вы описали (т.е. не описали вообще ничего) проблем нет.
Nc_Soft: Разница в том, что через <table> нельзя будет абсолютом внутри элементы позиционировать, а внутри <div style="display: table;"> - можно. А в остальном да - разницы нет.
