HTML Coding

29542 questions in this forum

1. Вопрос по @media

   Всем привет, есть документация под нормы расширения экранов @media screen , где обозначено до скольки PX я могу скажем так воображать себе в голове под что я верстаю телефон/планшет/пк ?

   Asked by Неугомонный, July 20, 2019

   • @media
   • css3
   0 votes
   2 answers
2. max-width внутри flexbox элемента в IE11

   Здравствуйте. Почему в этом примере https://jsfiddle.net/pk2rgj3o/4/ в IE11 не срабатывает max-width для изображения? Мне нужно, чтобы фото не выходило за пределы родителя, при этом его ширина и ширина flex-item оставались автоматическими. В данный момент я нашел два решения этой проблемы: 1) width: 100% для фото и 2) flex: 1 для flex-item, но они оба не подходят.

   Asked by alex_web64, July 21, 2019

   0 votes
   0 answers
3. Иконка для ссылки

   https://jsfiddle.net/q2Lfaew5/2/ Пытаюсь добавить иконку к ссылке. Казалось бы, довольно простая задача, но есть несколько условностей, из-за которых пока ничего не получается. 1) Текст должен быть inline-элементом. Для того, чтобы к каждой строке применялась граница, и пустота в них была не кликабельной (как в первом примере). 2) Иконка всегда должна быть вертикально отцентрированная. Реально ли это сделать?

   Asked by alex_web64, July 21, 2019

   0 votes
   6 answers
4. Почему свойство float убирает background?

   <ol class="app"> <li><span>доставка от 2 дней</span></li> <li><span>скорость производства 600 м2/сутки</span></li> <li><span>гарантия от 5 лет</span></li> </ol> ol{ background: #7A7A7A; } ol.app li{ width: 100%; float: left; } https://jsfiddle.net/m1Lkwzuv/1/ Почему со стилем "float", свойство "background" не работает? если закомментировать "float", то заработает.

   Asked by Grani, July 22, 2019

   0 votes
   1 answer
5. адаптивное меню

   Каким должно быть меню на чистом CSS или JS реализация кнопки анимации открыть/закрыть ?Вы скажете какой вариант выберешь такой и будет, я верстаю первый шаблон и для меня очень важно отталкиваться в правильном направлении, если можно плюсы и минусы вариантов кто понимает в этом или свой вариант1 на чистом css https://jsbin.com/yokic/edit?html,css,output2 за счет js (jQuery) https://codepen.io/katienazarova/pen/dKyEOy?editors=1100

   Asked by Неугомонный, July 22, 2019

   0 votes
   2 answers
6. Логотип и навигация

   Обернул я логотип в <nav> и возникла проблема когда применяю к ссылкам Ссылка1/Ссылка2 и т.д float:right они отображаются в обратном порядке <header> <nav> <a class="" href="#">LOGO</a> <a class="" href="#">Ссылка 1</a> <a class="" href="#">Ссылка 2</a> <a class="" href="#">Ссылка 3</a> <a class="" href="#">Ссылка 4</a> <a class="" href="#">Ссылка 5</a> </nav> </header>

   Asked by Неугомонный, July 25, 2019

   0 votes
   3 answers
7. Вопрос по @media

   <style> .right { float: right; } @media only screen and (max-width: 600px) { .zzzz { display: none; } } </style> <div class="right zzzz"> // ... </div> Необходимо создавать класс zzzz для шаблона больше чем 600px если мне нечего будет вписать в него никаких параметров ?

   Asked by Неугомонный, July 25, 2019

   • ccs3
   • @media
   0 votes
   7 answers
8. Рамка

   Подскажите пожалуйста, как сделать такую рамку? , я пробовала box-shadow, , но результат не тот, что нужен box-shadow: 0 0 10px 1px grey;

   Asked by EkaterinaSan, July 26, 2019

   0 votes
   2 answers
9. Линии вокруг текста

   Доброго времени суток форумчане. Не подскажете, как можно реализовать такие линии вокруг текста?

   Asked by no__name, July 26, 2019

   0 votes
   2 answers
10. Поместить кнопку внутрь блока

    Как всегда я % 80 смог сделать а дальше не тащу вообще. В общем как сделать чтобы "Кнопка" была внутри фиолетового контейнера но не помещая ее в <div class=main></div> ? https://jsfiddle.net/4Lepbdnr/

    Asked by Неугомонный, July 27, 2019

    0 votes
    5 answers
11. Из svg в png

    Как из этого сделать .png изображения? , видел есть конвертеры онлайн, но че то не получается у меня правильно переместить в .svg файл данные <svg aria-hidden="true" style="" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> <defs> <symbol id="icon-user" viewBox="0 0 32 32"> <title>user</title> <path d="M15.782 0.381c-4.405 0-8 3.595-8 8s3.595 8 8 8 8-3.595 8-8c0-4.405-3.595-8-8-8zM15.782 2.667c3.17 0 5.714 2.545 5.714 5.714s-2.545 5.714-5.714 5.714c-3.169 0-5.714-2.545-5.714-5.714s2.545-5.714 5.714-5.714z"></path> <path d="M16 18.667c-8.515 0-15.619 5.867-15.619 13.333…

    Asked by Неугомонный, July 28, 2019

    0 votes
    3 answers
12. Локальное подключение иконок Font Awesome

    Добрый день! Я столкнулся с такой ситуацией: создается в компании статическая страница для хранения служебных документов. Иконки там, по-факту, не нужны, но начальник как во всем известном видео: "Хочу иконки!". Для нее поднимается локальный сервер без выхода в инет. На сайте есть ссылка прямая на хранилище с данными иконками, но она при такой настройке сервера, не работоспособна. Я качнул с сайта архив с данными иконками. Прописал как в инструкции путь в проекте. И тут я в непонимании: в инструкции для локального подключения подключается файл с расширением .css, через тег <link>, при этом все иконки, которые я использовал при подключении прямой ссылки на хранилище…

    Asked by Super_Saimon, July 29, 2019

    • html
    • css
    0 votes
    1 answer
13. Блок по центру экрана

    Как растянуть блок по размеру экрана а не так чтобы он улетал за экран? // CSS .dropdown { display: inline-block; } .dropdown-content { z-index: 1; display:none; position: absolute; background-color: #000; width: 100%; padding: 46px 24px 40px; max-width:1358px;; } .dropdown:hover .__open { background-color: #000; color: #4a4a4a; } .dropdown:hover .dropdown-content { display:block; } // HTML <div class="dropdown"> <a class="__open" href="#">Ссылка 4</a> <div class="dropdown-content"></div> </div>

    Asked by Неугомонный, July 29, 2019

    0 votes
    17 answers
14. как сверстать элемент с углами и дать ему деть?

    Друзья, всем привет. Я учусь верстать, и вот не могу разобраться сейчас, как сверстать такой элемент на десктопе 4 блока в ряд. на мобиле 4 блока в столбик. как бы проблемы с вёрсткой блока нет, как и с медиа запросом, чтобы на мобильнике их сделать в ряд. но как сверстать этот угол? да еще так, чтобы у всего этого блока была тень. вот как сверстать такую фигуру с закруглением всех углов на 10 пикселей и добавлением тени? помогите плиз кодом всем заранее спасибо за участие вот картинка для наглядности

    Asked by freeodmin2, July 30, 2019

    • css
    • фигура
    0 votes
    1 answer
15. opacity

    Что-то я не понял фишки z-index: -1; применил чтобы убрать блок а он все равно появляется https://jsfiddle.net/g5kwn3cm/1/

    Asked by Неугомонный, July 30, 2019

    0 votes
    4 answers
16. Позиционирование содержимого

    Посмотрите пожалуйста, на данный скрин На данной странице, я закрепил - содержание - к экрану 2 вопроса: Если я оставлю ссылки слева, то последняя глава останется в блоке, и не будет залезать на общий текст,а если переношу на права, то как видите накладывается текст на текст Почему "Содержание!!!" осталось слева ? <nav class="content"> <h2>Содержание!!!</h2><br> <a href="..." class="href">ссылки</a> </nav> css .content{ background: #fff; position: sticky; top:0; padding-bottom: 20px; padd…

    Asked by BblIIIu6aJIa>onlypro, July 31, 2019

    0 votes
    5 answers
17. transition

    В общем понял чуть чуть transition что margin-top это к чему мы применяем, 1s; это время за сколько выполниться смещение к margin-top: 0;, но сижу ломаю голову как заставить салатовую полоску border-right заполнять весь блок справа на лево при наведении на блок с ссылка? https://jsfiddle.net/nzw4ghkq/

    Asked by Неугомонный, July 31, 2019

    0 votes
    21 answers
18. БЭМ. Правильно ли?

    Доброго. Пришло время осваивать БЭМ -_- Подскажите, правильно ли в данном случае оформлено? (в данном посту буду и дальше задавать вопросы, так что не расходимся? ) Для обучения пока выбрал простенький макет. <header class="header"> <div class="header__text"> <p class="text-head"> Заголовок </p> <ul class="text-main"> <li class="text-main__item"> Пункт 1 </li> <li class="text-main__item"> Пункт 2 </li> <li class="text-main__item"> Пункт 3 </li> <li class="text-main__item"> Пункт 4 </li> </ul> &l…

    Asked by Max94, August 3, 2019

    0 votes
    0 answers
19. height и bottom

    position: fixed; top: 0; right: 0; height: 100%; Смотрю никто никогда не указывает bottom:0; а используют height: 100%; , почему?

    Asked by Неугомонный, August 3, 2019

    0 votes
    2 answers
20. Подскажите в чем может быть проблема

    Подскажите пожалуйста как это исправить, прилеплю ниже видео https://recordit.co/0B2rrlVWtf

    Asked by Byblon, August 6, 2019

    0 votes
    1 answer
21. Стрелка с вогнутыми гранями

    Доброго времени суток, господа. Не подскажете как можно сверстать блок с такой стрелкой?

    Asked by no__name, August 12, 2019

    0 votes
    4 answers
22. Альтернативный вариант верстки секции

    Добрый вечер, ребят. Нужно было сверстать секцию(см. картинку). Долго думал как вот это вот все можно реализовать и таки набросал черновой вариант. Собственно у меня вопрос: можно ли это сверстать как-то попроще ? Ну и в дополнение к вопросу, кому не сложно, можете оценить верстку?

    Asked by no__name, August 13, 2019

    0 votes
    5 answers
23. Flexbox вместо masonry?

    Привет! Есть галерея в конце страницы, построенная на masonry https://www.farmadental.ru/doctors/balayan Подозреваю, что на флексе сделать такое вполне реально, более того, нашел пример, демонстрирующий прекрасный результат Но для флекса по колонкам нужна ограниченная высота контейнера, которая в моем случае всегда разная, т.к. количество и размер элементов всегда разные. Реально ли как-то добиться этого без использования JS ?

    Asked by d0ublezer0, August 15, 2019

    0 votes
    1 answer
24. Отступы от текста

    Здравствуйте, подскажите пожалуйста как избавиться от отступов в тексте, чтобы границы блока обтекали текст пиксель в пиксель. Все padding-и разумеется убрал, но непонятный зазор между границей блока и текстом все ровно остался.

    Asked by Valery Subbotin, August 18, 2019

    • html
    • css
    • text
    • начинающий
    0 votes
    4 answers
25. Блочный элемент в inline-blockk

    Может ли inline-block содержать в себе блочный(е) элемент(ы)?

    Asked by torsar, August 19, 2019

    0 votes
    6 answers