Дикий блог

Решение не работающего max-width для изображений в таблицах (Firefox и IE)          Я уже писал, что max-width не работает в Firefox и IE 11 для изображений в таблицах, теперь вот решил собрать в одном месте все решения этой проблемы. Пятый раз, правда начинаю писать пост и удаляю случайно.          1) Прописываем width: 100% изображению. После этого оно начнет корректно ужиматься. Только я советую добавить height: auto. В идеале, можно еще использовать max-width с max-height. И в них указать размер картинки.          2) Добавить таблице table-layout: fixed. После этого картинки внутри будут корректно: http://dikij.com/blogger/2016/?id=24

Chuwi Hi12 - планшетный пк Windows 10 и Android 5.1 Так как я не очень везучий (или руки дырявые) пришлось купить Chuwi Hi12 - вместо разбитого Chuwi vi10.                    Больше всего в покупке помогла распродажа на Алиэкспресс и бонусные баллы. Ииначе мне бы его никогда не купить. Единственное, клавиатуру пришлось заказать у другого продавца. И она пока где-то в пути.          Это пожалуй, и будет основная «фишка» этого планшета. С ней он превращается в полноценный ноутбук. Хоть и стоит значительно дешевле.          Особой радости в Windows 10 и Android 5.1 я лично не вижу, так: http://dikij.com/blogger/2016/?id=23

#SAPE! Зачем птички? Новый #дизайн должен быть #теплыйламповый! http://vk.cc/553ccB #теплый #ламповый #сапе : http://www.sape.ru/index.php?set_refid=3dbafc7fd6

Как уменьшить весь сайт при уменьшении ширины экрана?          Встретил тут на одном форуме код и обсуждения на эту тему. Написал свою версию для примера.          Так делать не нужно! [id705766|Владислав Юхананов] screen and (max-width: 768px) html width: 100%; height: 150%; body transform: scale(0.5); transform-origin: center top; [id705766|Владислав Юхананов] screen and (max-width: 384px) htmlwidth: 100%; height: 175%; body transform: scale(0.25); transform-origin: center top;          Без использования зума, так как он не кроссбраузерный вообще. Да, мы просто трансформацией уменьшаем весь сайт. В примере код для 768 пикселей (и меньше) и для 384px.          Я хотел написать скрипт, который уменьшал бы сайт: http://dikij.com/blogger/2016/?id=22

Адаптивный сайт по ТЗ          Как бы это странно ни звучало, но сайт spasibovsem.ru - первый в моем портфолио по адаптивному дизайну, который сделан четко по ТЗ (Техническое задание на разработку мобильной версии СпасибоВсем.ру).          Обычно делаю все «наоборот». Начинаю с больших разрешений (от 775px) и постепенно уменьшаю ширину экрана. При этом ведется работа над переносом всех блоков на сайте и их правильным «складыванием».          Тут же пришлось начинать с «мобильного вида» на 310px, который был прописан в: http://dikij.com/blogger/2016/?id=21

Добавлен пример: http://dikij.com/test.php: http://dikij.com/test.php

Добавлен пример: http://dikij.com/test2.php: http://dikij.com/test2.php

Адаптивные таблицы при помощи CSS стилей 3. Справляемся с thead и tbody одновременно          Я уже писал про адаптацию таблиц для мобильных устройств. И писал про адаптивные таблицы при помощи стилей.          Это отлично срабатывало при переделке сайтов aliexpressblog.ru и nost.ru этого хватало. А вот в адаптации таблиц на topdealers.ru возникли некоторые проблемы.          Прошлый раз прокрутку в таблицах (без добавления дополнительных оборачивающих элементов) удалось включить вот такими стилями: table border: 1px solid #333333; width: 100% !important; overflow: auto !important; display: block !important; table tbody display: table !important; width: 99.9% !important;          А в: http://dikij.com/blogger/2016/?id=20