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

Арамаис Мирзоян

Веб-разработчик. Разрабатываю сложные сайты.
Ответы пользователя по тегу CSS

  • Как сделать аватарки разных форм через css?

    websitedev
    @websitedev
    Веб-разработчик. Разрабатываю сложные сайты.
    Если у вас есть png прототипы с этими формами, тогда вы можете использовать mask-image. Пример
    Ответ написан
    Комментировать
    Комментировать

  • Как сверстать такой блок?

    websitedev
    @websitedev
    Веб-разработчик. Разрабатываю сложные сайты.
    Алгоритм примерно такой — создаете один родительский div, которому присваивайте свойство display: flex, внутри этого div-а создаете 3 дочерних div-ов, которым присваивайте width: 33.333333%. Внутри этих div-ов размещаете изображения и тексты. Этим div-ам можете дать text-align: center, чтобы отцентрировать изображения и тексты.

    Попробуйте сделать, если будут вопросы, напишите в комментариях, помогу.
    Ответ написан
    Комментировать
    Комментировать

  • Как сделать ссылку в классе?

    websitedev
    @websitedev
    Веб-разработчик. Разрабатываю сложные сайты.
    Эти стили распространяются и на все li, которые находится внутри ulheader.

    ul.ulheader li a {
    position: relative;
    top: -20px;
    line-height: 80px; 
    padding: 0 20px; 
    height: 80px; 
    color: #777;
   -webkit-transition: all .1s ease-out;
   -moz-transition: all .1s ease-out;
   -ms-transition: all .1s ease-out;
   -o-transition: all .1s ease-out;
   transition: all .1s ease-out;
}


    Нужно делать так, чтобы стили распространялись только на тех li, которые стоят на самом высоком уровне от родителя. 

    ul.ulheader > li > a {
    position: relative;
    top: -20px;
    line-height: 80px; 
    padding: 0 20px; 
    height: 80px; 
    color: #777;
   -webkit-transition: all .1s ease-out;
   -moz-transition: all .1s ease-out;
   -ms-transition: all .1s ease-out;
   -o-transition: all .1s ease-out;
   transition: all .1s ease-out;
}


    Смотрите готовый пример
    Ответ написан
    3 комментария
    3 комментария

  • Почему не работает валидация поля формы?

    websitedev
    @websitedev
    Веб-разработчик. Разрабатываю сложные сайты.
    1. Нужно убрать function отсюда
    function formAddError(input);
    2. Везде заменить classlist на classList
    3. Здесь убрать пробел, это проверка на пустую строку.
    //Было
if(input.value === " "){
    function formAddError(input);
    error++
}
//Стало
if(input.value === ""){
    function formAddError(input);
    error++
}

    4. Добавить класс error
    .error {
   background-color: red;
 }


    Исправленный пример можете посмотреть здесь
    Ответ написан
    2 комментария
    2 комментария