Задать вопрос
lina666

Kotaro Hiba

Изучаю веб ЯП.
Ответы пользователя по тегу CSS

  • Адаптивный PWA select. Как это реализовать?

    lina666
    @lina666
    Изучаю веб ЯП.
    Готовы решения, можно искать в интернете, вероятно оно будет в каких то готовых UI библиотеках - Vuetify, Bootstrap и т.д или можете поискать просто в интернете готовый код.
    Встроенного функционала, который позволит сделать такое в браузерах нет, т.е прийдется реализовывать такой селектор самому при помощи html/css/js
    Ответ написан
    Комментировать
    Комментировать

  • Как задать цвет заднего фона для каждой колонки?

    lina666
    @lina666
    Изучаю веб ЯП.
    Как вариант вижу только разбивать все это дело на отдельные блоки. Судя по спецификации, в CSS нет определенного св-ва.
    Еще как вариант можно конечно, сделать блок абсолютный внутри с 3мя блоками, с такими же нужными отступами, но это так, костыльное решение в голове.
    Сколько верстаю, 1й раз вижу это св-во.

    UPD костыльный вариант работает ))).
    Еще как вариант, можно написать JS который будет разбивать текст на N кол-во блоков и распределять между 3мя дивами, это выйдет довольно быстро.
    Ответ написан
    2 комментария
    2 комментария

  • Как сделать горизонтальную прокрутку как на мобильном устройстве?

    lina666
    @lina666
    Изучаю веб ЯП.
    Можешь отслеживать зажатие мыши над элементом. После чего читать движение влево вправо и на это же расстояние двигать скролл 

    document.getElementById('block').mousemove = function(e) {
    if (e.which == 1) {} // Нажата левая кнопка мыши
    if (e.which == 2) {} // Нажато колёсико мыши
    if (e.which == 3) {} // Нажата правая кнопка мыши
}


    В целом можешь между срабатываниями считать разницу в координатах и менять значение у елемента element.scrollLeft

    Я бы так сделал, но не знаю на сколько это нужно, скорее всего пользователь просто не поймет, что там нужно скролить, если ему это никак не обозначить + рушится опыт пользователя т.к я не видел, что бы где то на десктопе делали скролл вбок при помощи мыши (не считая слайдеров)
    Ответ написан
    1 комментарий
    1 комментарий

  • Перенос элементов flexbox по несколько штук сразу без дополнительных обёрток. Как?

    lina666
    @lina666
    Изучаю веб ЯП.
    не знаю на сколько актуально, но вот решение задачки 
    <style lang="scss">
  .row {
    display: flex;
  }
  .row__block {
    /*Смотрим на каком моменте нам нужно это сделать */
   @media  (max-width: 1200px){
     flex: 0 1 50%;
     display: flex;
     flex-direction: column;
     align-items: center;
     justify-content: center;
   }
  }
</style>
<div class="row">
  <div class="row__block"></div>
  <div class="row__block"></div>
  <div class="row__block"></div>
  <div class="row__block"></div>
</div>

    Ну или что то типо того, по крайней мере я таким хаком пользуюсь
    Ответ написан
    Комментировать
    Комментировать