Bugert

Точно? Посмотреть не могу ("We're truly sorry, but there is no such page").

Речь идет об обычной кнопке с hover-эффектом. С png все получается. Код выглядит примерно так: a.overBtn { display: block; height: 32px; width: 124px; background-image: url(../images/bt.png); background-repeat: no-repeat;}a.overBtn:hover { background-position: 0px -32px;}Для изображения устанавливаются четкие границы. И нижняя часть кнопки, которая перемещается при наведении курсора в видимую позицию, отрезана заданными размерами изображения. Если png поменять на svg, то последний тупо масштабируется (уменьшается), заполняя заданные размеры. Того же эффекта достигнуть не удается. SVG всегда заполняет данный блок. Можно ли как-то реализовать hover с одной картинкой, путем изменения позиции, с помощью svg?

Как-то странно начал вести себя Sublime Text 3. Напрочь игнорирует существующее форматирование документа, будь то css, html или что-то еще. При открытии автоматически делает после каждой строки три пропущенных (т.е. три "энтера"). Это как-то лечится? Если это важно, то до этого работал в Windows 8.1, было все хорошо. Поставил Windows 10 и, соответственно, вновь поставил Sublime Text 3 - началась такая бяка.

Спасибо. Покопаю в сторону SVG.

Ничего не меняет от того, какого изначально картинка размера. Хоть я её сохраню в 100 на 70px. Лесенка от этого не убирается. И я и так создаю их в векторе, затем экспортирую в png. Может быть, подскажите, пожалуйста, в чем может быть дело? Перезалил картинку, изменив ширину до 300px. Лесенка в IE и Firefox. Не имеет значения, какого картинка размера, потому что при масштабировании в этих браузерах она все равно портится. И меня интересует, как данную проблему решают?

Например, вот - http://bugert.meximas.com/ . Картинки в слайдере покрываются лесенкой (для картинки задан width в процентах и она масштабируется в зависимости от ширины родителя при разных @media). Но я что-то совершенно запутался, т.к. вот тут - http://bugert.meximas.com/new/ я задал все величины в процентах и картинка в Мозилле масштабируется без артефактов, хотя в IE беда.

Столкнулся с проблемой - в Мозилле и IE картинки, уменьшенные средствами css выглядят ужасно, в лесенке. Свойство image-rendering, отвечающее за алгоритмом интерполирования изображения при масштабировании, к сожалению, не дает никакого результата. Погуглил, но так и не нашел решения данного вопроса. Будто бы он никого и не волнует? Как же тогда быть? Делать множество копий картинки нужного размера под каждое разрешение экрана?

для orientation:landscape.Вы лучше найдите хорошую статью по MQ. И все сразу станет понятно. Конечно, понятно, что для orientation:landscape. Статьи я уже читал. Но где на практике это может быть полезно, если достаточно просто @media screen and (max-width: Npx)? Ведь дизайн и так тянется на ширину экрана при его повороте.

Разобрался. Просто ступил. Дело в том, что я указывал @media screen and (max-width: 480px){стили под 320px}, а это значит - при ширине, меньшей или равной 480px. Т.е. при ландшафтном развороте экран имел ширину 480px и условие выполнялось правильно. Нужно было просто указать max-width: 479px. Я вот только теперь не понимаю, а зачем может понадобится orientation:landscape ?)

Указал <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />. Указывал и and (orientation: landscape), но с этим у меня вообще всё съезжает.

Всем привет. Задал через @Media поведение ширины слоев под разные разрешения. По такому типу: @media screen and (max-width: 720px){ body{ width: 640px; } div.nav{ width: 640px; }} Проверил на телефонах. При ландшафтной ориентации экрана слои не растягивают на ширину экрана. Например у телефона разрешение 320x480. У меня медиа заданы и под 320 и под 480. И по идеи, при перевороте сайт должен тянуться на 480px. Можно ли это как-то исправить?