AlexZaw

Эксперт
  • Публикации

    526
  • Зарегистрирован

  • Посещение

  • Дней в лидерах

    36

Последний раз AlexZaw выиграл 23 января

Публикации AlexZaw были самыми популярными!

Репутация

76 Хорошая

6 подписчиков

О AlexZaw

  • Звание
    Активный участник
  • День рождения 12/03/1978

Информация

  • Пол
    мужской
  • Откуда
    Томск
  • Интересы
    Верстка, книги, EVE Online :)

Посетители профиля

1201 просмотр профиля
  1. AlexZaw

    Как вставить курсор в нужное место?

    var formComment = document.querySelector('.write-comment'); formComment.innerHTML = '<b>' + userName + ',' + '</b>' + '&nbsp;'; formComment.appendChild(userNameHtml); Можно так: <p id='aaa' style=" padding: 10px; background: white; width: 50%;" contenteditable="true" class="write-comment"></p> <button id="btn">Click me</button> var userName = "Vasya Pupkin"; btn.onclick = function () { var formComment = document.querySelector(".write-comment"); formComment.innerHTML = "<b>" + userName + "</b>" + ", "; formComment.focus(); var sel = window.getSelection(); var range = document.createRange(); range.setStart(formComment, formComment.childNodes.length); range.collapse(true); sel.removeAllRanges(); sel.addRange(range); };
  2. AlexZaw

    не работают табы

    console.log('лик по табу');
  3. AlexZaw

    Как лучше сверстать?

    На днях была точно такая же тема:
  4. AlexZaw

    Оформление страницы с помощью flexbox

    Попробуйте адаптировать ваш код для мобильных устройств с разным расширением. С учетом того что количество текста напротив "строк" с картинками может быть разным (количество строк тоже, кстати, может меняться). Желательно еще что бы, промежуточные от основных разрешения, тоже выглядели бы прилично и не рассыпались как попало. Если получиться сделать это с легкостью - все нормально. Если же возникнут трудности, то так делать не стоит :) Я конечно придираюсь, и задаю сложные задачи для начинающего, но, в будущем, все это вам придется учитывать.
  5. AlexZaw

    Оформление страницы с помощью flexbox

    Примерно так можно: <div class="wrap"> <ul> <li> <div class="empty"></div> <img src="http://placekitten.com/200"> <div class="text">Lorem ipsum dolor sit amet consectetur adipisicing elit. Officia repudiandae earum vero fuga maxime deleniti tempora debitis nulla ullam asperiores, eaque dolorum ex facilis soluta, neque suscipit. Dolor, dolores maxime.</div> </li> <li> <div class="empty"></div> <img src="http://placekitten.com/200"> <div class="text">Lorem ipsum dolor sit amet consectetur adipisicing elit. Officia repudiandae earum vero fuga maxime deleniti tempora debitis nulla ullam asperiores, eaque dolorum ex facilis soluta, neque suscipit. Dolor, dolores maxime.</div> </li> <li> <div class="empty"></div> <img src="http://placekitten.com/200"> <div class="text">Lorem ipsum dolor sit amet consectetur adipisicing elit. Officia repudiandae earum vero fuga maxime deleniti tempora debitis nulla ullam asperiores, eaque dolorum ex facilis soluta, neque suscipit. Dolor, dolores maxime.</div> </li> </ul> </div> .wrap { border: 1px solid #000; max-width: 800px; margin: 0 auto; } ul { display: flex; flex-direction: column; list-style: none; padding: 0; } li { display: flex; align-items: center; } li * { width: 33.33%; } li:nth-child(odd) { direction: rtl; text-align: right; } img { border-radius: 50%; vertical-align: middle; }
  6. AlexZaw

    Как сделать такие блоки?

    Сделайте плюсик отдельным блоком или с помощью псевдоэлемента и залейте фон градиентом
  7. AlexZaw

    Подскажите как сделать такую форму?

    Зачем? Используйте обычный div, и внутри него уже расположите кнопку
  8. AlexZaw

    Не могу убрать падинги у li

    Если вы сделаете активным другой пункт меню, то будет тоже самое, так что это не Home виноват :) Это пустое место, как и "большой паддинг" образуется из-за дефолтных отступов между инлайновыми элементами. Задайте для .main-menu размер шрифта ноль, а для .main-menu li установите нужный размер шрифта. Сразу же пропадут лишние отступы
  9. AlexZaw

    Не могу установить emmet

    Вы бы хоть указали в каком редакторе вы пытаетесь установить emmet. Вот тогда, тот кто пользуется таким-же редактором, вам может подсказать где эта консоль. А вообще, может быть, что это просто проблемы с доступом к серверу где находится плагин и все заработает через какое то время :)
  10. document.getElementById("cell1").innerHTML=document.getElementById("cell1").innerHTML+"A";
  11. А вот так не проще? <span class="hider"> Я родительский hider. <a href="http://google.com">Эту ссылку должно быть видно.</a> Я продолжение родительского hider. <span class="hider"> Я дочерний hider. <a href="http://google.com" class="bold">Меня не должно быть видно при наведении курсора на родителя.</a> Я дочерний hider. </span> Я продолжение родительского hider. </span> .hider { background-color: gray; padding: 7px; line-height: 1.5em; } .hider, .hider a{ color: transparent; } .bold{ font-weight: bold; } .hider:hover{ color: #000; } .hider:hover > a { color:blue } Плюсы: Работает во всех браузерах Со 100% вероятностью будет использован нужный цвет, а не цвет по умолчанию или цвет родителя. Минусы: Чуть увеличивается код. Вроде все :)
  12. Попробуйте почитать вот тут: https://code.visualstudio.com/docs/editor/emmet Возможно отключилась какая-то из настроек
  13. Возможно слетел плагин Emmet, ну или чем вы там пользуетесь для автозаполнения
  14. AlexZaw

    Изменение порядка блоков

    Тогда grid. Если и он не подходит - тогда JS, ну или делать дублирование блоков и в зависимости от ширины экрана показывать/скрывать нужные блоки. Вообще-то есть. Правда там ее мало, но есть ссылки на то где можно почитать подробнее. А вообще htmlbook это старая версия сайта, новая находится по адресу https://webref.ru ну и гугл никто еще не отменял
  15. AlexZaw

    Изменение порядка блоков

    Использовать свойство order у флексов