Ответы пользователя по тегу CSS
  • Как растянуть боковые отступы li в меню?

    @telegraphnij_stolb
    Оба ответа не полные.

    1) display: table-cell

    свойства задать нужно ячейкам(для ul не нужно задавать display: table)

    li {
      display: table-cell;
      width: 1%;
    }


    При этом будет глючить при адаптиве в Safari некоторых версий(подробнее)

    2) text-align: justify;

    свойство работает только если есть как минимум 2 строки. Значит нужно сымитировать 2-ую строчку при помощи псевдоэлемента. Из-за этого появится ненужный отступ снизу. Убрать можно либо установив для меню высоту, либо line-height: 0; (font-size: 0 очень глючный, его ставить не советую). Потом line-height нужно будет явно задать для li.

    Задать высоту - наилучший вариант, т.к. в варианте с line-height, если нужна поддержка Opera 10-11, то в них надо еще и font-size 0.5px задавать. И все равно 1px отступ снизу останется. А с высотой проблем нет.

    код:

    ul {
      text-align: justify;
      text-justify: distribute-all-lines;  /* IE */
      height: 40px; /* (либо line-height: 0;) */
    }
    
    ul: after {
      display: inline-block;
      width: 100%;
      height: 0;
    }
    
    li {
      display:  inline-block;
      vertical-align: top;  /* (если задали line-height: 0 для ul, то тут нужно перезадать line-height)*/
    }
    Ответ написан
    Комментировать
  • Что можно писать на блокноте верстальщику?

    @telegraphnij_stolb
    Калькулятор я прямо в редакторе использую. Для Sublime Text есть как минимум 2 плагина.

    А блокнот не реальный тоже использую. Просто создаю файлик отдельный текстовый в папке с проектом. Его в гитигнор заношу на всякий случай. В нем пишу то, что нужно учитывать для адаптивной верстки. Например, какие я сделаю размеры заголовков на каких страницах при каких разрешениях. Какие размеры шрифта будут у обычного текста, какие разрешения, какие основные изменения будут на сайте при переходе. Что где учесть нужно. То есть вещи, которые ты для себя отмечаешь на этапе проектирования. Пока еще не начал код писать. Чтобы потом переделывать по 5 раз не пришлось и был наиболее оптимальный код.
    Ответ написан
    Комментировать
  • Overflow: auto без height/max-height

    @telegraphnij_stolb
    Нужно создать новый контекст форматирования блоков.

    Это можно сделать как с помощью overflow: hidden, так и с помощью overflow-x hidden. Вот так в данном случае и нужно поступить для контейнера.

    codepen.io/anon/pen/jECLF
    Ответ написан
  • Эпопея борьбы с футером. Как прижать его к низу, но не как у всех?

    @telegraphnij_stolb
    Вот 100%-ый вариант: peterned.home.xs4all.nl/examples/csslayout1.html
    Ответ написан
    Комментировать