Местоположение
Россия

Достижения

Все достижения (2)

Наибольший вклад в теги

Все теги (13)

Лучшие ответы пользователя

Все ответы (13)
  • Что это за полосы и как их убрать (IE11 + Bootstrap 4)?

    oink
    @oink Автор вопроса
    Профессиональный веб-макакинг
    Как обычно, выручил Stack Overflow. Судя по всему, это известный баг IE, который не дает нормально обрабатывать значение box-shadow (особенно когда оно анимировано). Один из обходных вариантов (ссылка ниже) - банально поместить псевдоэлемент с совпадающим цветом фона за область, где этот баг проявляется. Если фон сложный - все равно будет некрасиво, думается мне, но мне повезло.
    https://stackoverflow.com/questions/22161981/remov...
    Ответ написан
    Комментировать
  • Как задать длину параграфа в CSS, чтобы она определялась его содержимым?

    oink
    @oink
    Профессиональный веб-макакинг
    Попробуйте
    display: inline;
    для тега p
    Ответ написан
    Комментировать
  • Как совместить в picture media и webp?

    oink
    @oink
    Профессиональный веб-макакинг
    <picture>
          <source type="image/webp" srcset="/assets/images/preview-tablet.webp, /assets/images/preview-tablet-retina.webp 2x" media="(max-width: 768px)">
          <source type="image/webp" srcset="/assets/images/preview-desktop.webp, /assets/images/preview-desktop-retina.webp 2x" media="(min-width: 769px)">
          <source type="image/webp" srcset="xxx.webp 1x, xxx.webp 2x">
          <source srcset="/assets/images/preview-tablet.jpg, /assets/images/preview-tablet-retina.jpg 2x" media="(max-width: 768px)">
          <source srcset="/assets/images/preview-desktop.jpg, /assets/images/preview-desktop-retina.jpg 2x" media="(min-width: 769px)">
          <img alt="preview">
    </picture>


    То же самое, только про webp написать в начале и не забыть добавить атрибут type="image/webp". Браузеры, которые ничего не поймут, пойдут дальше и увидят jpg.
    Ответ написан
    1 комментарий
  • Как правильно сверстать блок?

    oink
    @oink
    Профессиональный веб-макакинг
    Если я правильно понял суть вопроса, можно каждой строке задать display: flex (можно и всем, но тогда дальнейшая настройка чуть сложнее), элементам-дивам - flex-basis 100%, ну и прочего по вкусу. Остальное флексбокс сделает сам:
    https://codepen.io/schegol/pen/WNbNdrR

    UPD. flex-shrink: 0 картинке еще забыл.
    Ответ написан
    Комментировать
  • Как центровать без смешение position: absolute;?

    oink
    @oink
    Профессиональный веб-макакинг
    .start{
      position:absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
    }


    Рекомендую запомнить метод, если продолжите заниматься версткой, этим трюком придется пользоваться тысячи раз.

    UPD. Только не к .start это надо применить, а к ссылке-родителю. Не заметил, что два img тут участвует.
    Ответ написан
    5 комментариев

Лучшие вопросы пользователя

Все вопросы (16)