12.11.2016, 17:25 | #51 |
Дикий
Регистрация: 02.06.2007
Адрес: <Noindex>
Сообщений: 2,551
Вес репутации: 360
|
Чуть не поседел на днях.
Не работает td {display: block;} и все тут (в Edge, IE 11, Сафари и Фаерфоксе). А это ведь чуть ли не самый важный прием, работающий для теплых ламповых табличных сайтов! Решения 1) Добавить td ячейкам width: 100%, так как иногда в таблицах указывается собственная ширина и высота колонок. 2) Прописать стили для остальных элементов таблицы: table, tbody, tr. Не полностью уверен в причинах влияния table и tbody, так как встречалось редко, но вот tr (строки таблицы) довольно часто мешают. Особенно при display: inline-block; 3) td {float: left; width: 100%;} - оказался рабочим вариантом сегодня. Именно float: left позволил ячейкам таблицы нормально переноситься друг под друга. 4) Экзотический вариант с table {position: relative;} td {position: absolute;} - слишком много мороки. Единственный подходящий случай - если нужно поменять порядок текста и картинки местами. Но и там position: absolute применяется только к одному элементу, а второму блоку просто добавляется отступ.
__________________
Делаю кулоны с опалами в стекле и не только! |
13.01.2017, 16:18 | #52 | ||
Дикий
Регистрация: 02.06.2007
Адрес: <Noindex>
Сообщений: 2,551
Вес репутации: 360
|
Кстати, 5 вариант для не работающего td {display: block;} - поменять доктайп на <!DOCTYPE html>
Кнопка перехода с адаптивной версии на полную 2 Недавно довел до ума. Очень хотелось поделиться многим нужно. Единственное, справиться без PHP не получилось. 1) ?mobile - закрыть от индексации в robots! Без него на мобильных - адский кеш, с которым не справиться. 2) Лучше не убирать адаптивные стили, а убирать только <meta name=viewport content="width=device-width, initial-scale=1"> Но можно и то и то. 3) Кнопка показывается на адаптивной версии. Или на полной, если есть куки. Связано с работой meta name=viewport. Иначе не перейти обратно будет. 4) Можно добавить ширину просмотра для полной версии. Например: <meta name="viewport" content="width=1300, initial-scale=1"> В шапку сайта (оставил место под эксперименты): Цитата:
Цитата:
__________________
Делаю кулоны с опалами в стекле и не только! |
||
25.01.2017, 00:13 | #54 | |||
Дикий
Регистрация: 02.06.2007
Адрес: <Noindex>
Сообщений: 2,551
Вес репутации: 360
|
Цитата:
Все немного меняется. Я сейчас начинаю с подключения стилей Цитата:
И самого adaptive.css: Цитата:
Использую редко, но вдруг понадобится.
__________________
Делаю кулоны с опалами в стекле и не только! |
|||
03.02.2017, 20:24 | #55 |
Дикий
Регистрация: 02.06.2007
Адрес: <Noindex>
Сообщений: 2,551
Вес репутации: 360
|
Небольшой "юбилей" - 100 сайтов в портфолио по адаптивному дизайну! Ненавижу лендинги, но купил: адаптивная-верстка.рф Огромное спасибо всем заказчикам! Особенно - за терпение. Без вас бы этого не было.
__________________
Делаю кулоны с опалами в стекле и не только! |
20.03.2017, 15:54 | #57 | ||
Дикий
Регистрация: 02.06.2007
Адрес: <Noindex>
Сообщений: 2,551
Вес репутации: 360
|
Я бываю крайне туп. Например, вообще забыл про просто спасительное для адаптивной верстки box-sizing: border-box;
Цитата:
Думаю, шаблон для начала работы можно чуть обновить: Цитата:
__________________
Делаю кулоны с опалами в стекле и не только! |
||
28.04.2017, 19:26 | #58 | |
Дикий
Регистрация: 02.06.2007
Адрес: <Noindex>
Сообщений: 2,551
Вес репутации: 360
|
Я тут нашел скрипт выдвижения меню свайпом (листанием вбок) на мобильном.
Абсолютно бесплатно могу добавить всем, кому делал сайты с выдвигающимся меню. Или кто использует мой скрипт адаптивного меню. Ну или можете добавить сами. Внутри уже есть вызов функций buter(); zakr(); при листании на 200 влево или вправо (xAbs > 200 || yAbs > 200). Цитата:
__________________
Делаю кулоны с опалами в стекле и не только! |
|
01.05.2017, 21:34 | #59 |
Мастер
Регистрация: 17.07.2012
Адрес: Москва
Сообщений: 815
Вес репутации: 200
|
Если у вас на сайте используется карта Яндекса через яваскриптовое API api-maps.yandex.ru/2.1 примерно вот в таком стиле:
то сделать её невылазящей за пределы контейнера, в который она помещена, имеет смысл добавлением в стили вот такой строки: Код:
.ymaps-2-1-50-map { width: 100% !important; max-width: 100%; overflow: hidden; } |
02.05.2017, 10:35 | #60 | ||
Дикий
Регистрация: 02.06.2007
Адрес: <Noindex>
Сообщений: 2,551
Вес репутации: 360
|
Цитата:
Например, так: Цитата:
__________________
Делаю кулоны с опалами в стекле и не только! |
||
|
|
Похожие темы | ||||
Тема | Автор | Раздел | Ответов | Последнее сообщение |
Оптимизация сайта | koctik | Общие вопросы оптимизации | 5 | 13.07.2013 15:23 |
SEO оптимизация сайта | birja | Общие вопросы оптимизации | 2 | 13.04.2012 10:54 |
Задачка... 3 строчки на JS. Хелп! | MonAmur | Разработка и сопровождение сайтов | 3 | 08.10.2009 14:50 |
Оптимизация сайта | sunplant | Общие вопросы оптимизации | 9 | 25.11.2008 09:15 |
оптимизация сайта :( | pha | Яндекс | 1 | 10.12.2007 15:54 |
Часовой пояс GMT +3, время: 02:51.