эти проценты нужно считать через середину, потому что картинку спозиционировали ровно в середину
right 50% + половина от ширины картинки, вся картинка 30%, половина - 15%
bottom - просто подбором, потому что кто ш его знает как считать и на дворе была глубокая ночь
mod133,
картинка у меня вырезалась 290х328 (можете вырезать квадратной, будет легче :) мне было проще проценты посчитать, чем ее подгонять)
я решила (от балды), что по ширине картинка должна занимать 30% блока - это первое значение в background-size
значит, если бы блок-родитель был квадратным, то по высоте получилось бы 33,93%
но блок-родитель не квадратный, а с соотношением сторон 2:1, значит процент который занимает картинка по высоте нужно умножить на 2 = 67,86 (ага, на jsfiddle ошиблась пока печатала, поправьте)
andreyWayne, у вас изначально прокручивалась страница, а не модальное окно.
Если вы про то, чтобы у модалки скролл шел по краю окна, то сделайте еще одну обертку.
Olek1, Хорошо, разговаривая. Нужно понять, что пиксель пикселю рознь.
Отложим пока вьюпорт и ретину.
Предположим, у меня есть монитор 1920х1080. У него диагональ 24 дюйма. Ширина около 50 см.
А также ноут с аналогичным разрешением. Но диагональ у него 13 дюймов.
И до кучи смартфон снова с таким же разрешением и диагональю 5 дюймов.
А если поменять разрешение экрана, то станет еще интереснее.
А если опять скучно, то сравнить как устройства показывают видео, изображения и сайты в браузере.
Никита Полевой, либо так, но если там много блоков и возможна ситуация, что display был разный, то слишком много писать получается?
Но, может, это потому что я css люблю больше, чем js.
Есть риск не попасть в нужный display при возвращении его на место. Например, потому что в верстке сначала было block, а потом верстальщик все таки перешел на flex, а про скрипт естественно никто не помнит.
Надежнее все таки через класс.
Только сначала свойство с префиксом, а потом основное, а не наоборот.
И в современном мире префиксы ставит автопрефиксер, так что можно их и не указывать вовсе.
Дмитрий Локшин, Обычно все таки сначала приходит ТЗ с pixel perfect или без него, а уже потом верстальщик решает какие единицы измерения использовать. Если всё происходит не в таком порядке, то вопрос об адекватности встает несколько с другой стороны.
Иван Анатоличь, нарисуйте как должны располагаться картинки если 2 и если 3. Пока по вашим объяснениям не очевидно, почему если добавить 3ю картинку на всю ширину, то первые 2 встанут ровно, если без 3ей они стоят криво.
Еще хорошо бы ваш текущий код на jsfiddle.net, чтобы не играть в угадайку.