1. веб-камера на Фукусиму-1

    1 year ago  /  0 notes  / 

  2. Раскладки

    http://www.w3.org/TR/css3-grid/ — модель раскладки от Microsoft
    http://www.w3.org/TR/css3-flexbox/ — модель раскладки от Mozilla, Opera и Apple
    http://code.google.com/intl/ru-RU/edu/submissions/html-css-javascript/ — раскладка на JQuery
    http://www.w3.org/TR/css3-multicol/ — раскладка на мультиколонках от Хокона Ли (Opera)
    http://www.w3.org/TR/css3-mediaqueries/ — раскладка под различные виды устройств вывода

    1 year ago  /  2 notes  / 

  3. http://www.sitepoint.com/ будет даже покруче, чем http://htmlbook.ru )

    1 year ago  /  2 notes  / 

  4. Вдогонку к предыдущему

    1 year ago  /  3 notes  / 

  5. Про условные комментарии и проверку использования javascript в вашем браузере

    Техника на самом деле довольно распространенная, но как-то не приходилось применять :)

    <!--[if lt IE 7 ]> <html lang="en" class="no-js ie6"><![endif]-->
    <!--[if IE 7 ]> <html lang="en" class="no-js ie7"> <![endif]-->
    <!--[if IE 8 ]> <html lang="en" class="no-js ie8"> <![endif]-->
    <!--[if IE 9 ]> <html lang="en" class="no-js ie9"><![endif]-->
    <!--[if (gt IE 9)|!(IE)]><!--><html lang="en" class="no-js"> <!--<![endif]-->

    В зависимости от версии IE будет использоваться один из именованных классов, плюс если в браузере отключен js, то будет использоваться класс no-js (в противном случае тем же js этот класс будет удален :).

    1 year ago  /  1 note  / 

  6. Немного про таблицы и html

    Ну вот давно я что-то не писал ничего о верстке. А вот сегодня захотелось. В общем-то, на работе как всегда ничего интересного, разве что был один тикет, о котором и будет речь.

    У нас почти на каждой странице веб-продукта выводятся табличные данные. Поэтому и сами таблицы в верстке — обычное дело. Очередной баг заключался в том, что в одной из ячеек таблицы была очень большая строчка, которая не должна была переноситься на другую строку. А таблица была завернута в два блока, один из которых, родительский, был фиксированной ширины. Тот, что был фиксированной ширины, не давал контенту разъезжаться на всю ширину страницы, а второй блок выполняет декоративную функцию. Ну и естественно, в IE таблица спокойно распирала блоки (неверное поведение), а вот все остальные браузеры отказывались это делать. А так как нам нужно добиться распирания блоков в этих браузерах, нужно было что-то придумать.

    Решение пришло неожиданно. Подивился тому, что таблице совершенно пофиг на размеры страницы и плевать она хотела на установленные размеры. И тут я понял. А что париться, пусть обертывающий блок, который должен растягиваться вслед за таблицей, будет фактически иметь свойства таблицы!

    Решение:
    .decoration-block { display: table; width: 100%; }

    Вот, в общем-то, и всё. Теперь этот блок растягивается вслед за таблицей, когда содержимое таблицы больше, чем ширина фиксированного блока.

    1 year ago  /  2 notes  /