HTML Coding

29,542 questions in this forum

1. Сворачивание меню при нажатии на ссылку

   Здравствуйте. Есть меню на html/css. Сделал ссылки для навигации с помощью якоря, но при нажатии на ссылку, меню не закрывается, так как для этого необходимо снять флажок с checkbox. Подумывал сделать из label ссылку, меню закрывается, текст оформлен как ссылка, но по ней не переходит. В общем, подскажите, пожалуйста, как сделать, чтобы я нажал на ссылку, попал на нужную часть сайта и меню закрылось без дополнительных действий https://jsfiddle.net/v8rwhuo0/1/ В дополнение: конечно же, хотелось бы то же самое провернуть с затемнением (чтобы меню закрывалось, если я кликну в любое место темной зоны) — class="mask-content" Заранее спасибо 🙂

   Asked by maisiq, June 6, 2021

   0 votes
   2 answers
2. Размещение фоновой картинки, заключенной в div, на всю ширину вьюпорта

   Подскажите, пожалуйста, как растянуть фоновую картинку, заключенную в div, на всю ширину вьюпорта? Сейчас она отображается посередине, по ширине макета. Указывала ширину 100%, 1200px, минимальную ширину 1200px - не работает. <div class="banner"> <div class="container background-image"> <div class="banner_text"></div> </div> </div> CSS: .background-image { background-image: url('/img/new_oranges.jpg'); background-size: cover; height: 200px; }

   Asked by Алеся, April 24, 2021

   • position
   • cover
   • width
   • div
   • image
   • background
   • html
   • css
   0 votes
   1 answer
3. Аккордеон на чистом HTML/CSS

   Добрый день. Подскажите как реализовать такой всплывающий блок как на картинке: 1) Блок на который один раз нажал должен быть открытым все время, до выбора другого блока; 2) Название блока в закрытом положении имеет черный цвет и стрелочка вниз, а при открытом синий цвет и стрелочка вверх 3) Реализовать с помошью HTML и CSS

   Asked by Romario1985, April 23, 2021

   • html
   0 votes
   2 answers
4. Проблема с псевдокласами

   Добрый день. Возникла проблема следующего рода. При верстке все псевдоклассы работают не корректно. Например задаю всем элементам margin-bottom:30px, соответственно у последнего я его пытаюсь почистить ипользуя last-child и задавая margin-bottom: 0. Но проблема в том что после этого все остальные элементы которым обьявил нижний отступ тоже обнуляются. С first-child та же самая проблема. В чем может быть проблема? Первый раз работаю с bootstrap может ли он повлиять на работу псевдоклассов?

   Asked by Romario1985, April 15, 2021

   0 votes
   4 answers
5. высота картинки

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

   Asked by Romario1985, April 24, 2021

   0 votes
   2 answers
6. Как изменить цвет вертикальной линии?

   Здравствуйте! Простите, если не сюда пишу. Что-то намудрил в стилях и при попытке изменения цвета вертикальной линии, цвет не меняется. Подскажите, пожалуйста, как корректно изменить цвет вертикальной линии. Код и результат можно посмотреть здесь https://jsfiddle.net/sn2uo9k4/ Буду благодарен советам!

   Asked by iiwanc, May 16, 2021

   • линия
   • цвет
   0 votes
   3 answers
7. flexbox и nth-last-child

   Добрый день. Возникла проблема следую щего плана, нужна адаптивная верстка с mobile-first. При этой верстке я сначла сверстал mobile получилась как на pictute1 picture1.psd. Чтобы сделать расстояние между блоками, которые я обвел бордером я задал margi-bottom, а у последнего элемента я его соответственно почистил. Но затем на tablet версииpicture2.psd и desktop picture3.psd у последнего элемента высота стала больше чем у остальных трех. При margin-bottom 0; для последнего элемента ничего не меняется. Что это за лишняя высота у последнего блока, откуда она появилась и как ее убрать?

   Asked by Romario1985, April 13, 2021

   0 votes
   2 answers
8. Оформить как ссылку

   Для смены языка на сайте нужно в адрес добавить например /ru/ текущий адрес узнаю так <p id="demo"></p> <script> document.getElementById("demo").innerHTML = "http://site.ru/ru/" + window.location.pathname; </script> но оно выдает текстом Вопрос: как сделать чтобы это была ссылка?

   Asked by maxim1o, May 27, 2021

   0 votes
   1 answer
9. div with arrow

   Добрый день. Подскажите как создать блок с таким зубцом как показано на рисунке. Спасибо

   Asked by Romario1985, April 21, 2021

   0 votes
   2 answers
10. Не отображается картинка

    Здравствуйте, я начал изучать html мой первый язык программирования и я много не понимаю и ещё не знаю. Я столкнулся с проблемой. Хотел я вставить картинку в свой сайт но она просто не отображается на сайте. Я пробовал разные варианты и также не получалось. Пишу код в Brackets. Пожалуйста помогите <img scr="https://bigsp.ru/uploads/position/large_01c6d2f3e6c3430fbb597cac07d746f86dde1a1d.jpg" width="250" height="400" alt="Суши">

    Asked by Moon632, July 16, 2021

    0 votes
    1 answer
11. Margin сверху выходит за границу элемента - родителя. Как это можно исправить?

    У меня есть элемент-родитель - div белый прямоугольник, внутри него вставляю картинку, прописываю ей margin, с левой стороны оно передвигается нормально, а сверху не хочет.. Если посмотреть через инструмент разработчика, то видно, что margin есть, но оно выходит за границу div - родителя. Не понимаю, в чем проблема..причем проблема не только здесь, но и еще в некоторых местах. С таким сталкиваюсь впервые.

    Asked by Gonqi, June 14, 2021

    0 votes
    3 answers
12. Позиционирование

    Доброго времени суток. Подскажите пожалуйста, как разместить иконку и текст на вкладке главного меню спозиционировав их по центру друг над другом. Позиционировать блоки или элементы внутри блока умею. Но здесь не пойму. Может нужно ссылку отобразить блочно, и потом размещать img и текст внутри?

    Asked by grabarartem, June 9, 2021

    0 votes
    4 answers
13. Как расположить radio input вертикально?

    Подскажите, пожалуйста, radio input с кнопкой выстроились горизонтально, нужно вертикально. Подскажите, пожалуйста, как преобразовать? Спасибо! <div class="voiting"> <span>How long have you...</span> <form method="post" action="#"> <label class="form__input"> <span>Youtube</span> <input type="radio" name="radio" value="youtube"> </label> <label class="form__input"> <span>instagram</span> <input type="radio" name="radio" value="instagram"> </label&g…

    Asked by Алеся, June 12, 2021

    0 votes
    8 answers
14. Как понять некоторые селекторы Bootstrap 4

    1 .btn-success.disabled или .btn-outline-info.focus Что значит вторая точка? Это класс disabled и focus? 2. .btn-outline-secondary:not(:disabled):not(.disabled):active Как это понять?

    Asked by Прогер, September 19, 2021

    • bootstrap4
    0 votes
    3 answers
15. Как исправить блок под Safari?

    Сверстал страничку. На Хроме, Опере, ФФ отображается норм. А вот в Safari этот блок растягивает. У меня нету техники apple что бы залезть в консоль. Может кто-нибудь поможет? Префиксы вроде бы на месте.Вот как в остальных браузерах и в Safari <div class="container"> <main class="3d-print-pages"> <section class="price-section padding-left"> <div class="price-section__call"> <h2 class="price-section__text-heading">Стоимость печати рассчитывается следующим образом:</h2> <div class="price-section-text-wrap"> <p class="price-section__text-price-strong"><strong>Цена 1 грамма пластика (ABS, PL…

    Asked by Bastian, September 21, 2021

    0 votes
    2 answers
16. Горизонтальный список съезжает на вёрстке, хотя отступов - нет

    Сделал горизонтальные элементы списка 2х2 с помощью display: inline-block, но элементы почему-то съехали, хотя никаких отступов НЕТ. Прошу, пожалуйста помочь.

    Asked by MenCeV, November 27, 2021

    0 votes
    7 answers
17. Не работает justify-content

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <link rel="stylesheet" href="style.css"> <link rel="preconnect" href="https://fonts.googleapis.com"> <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> <link href="https://fonts.googleapis.com/css2?family=Raleway:wght@400;500;700;800&display=swap" rel="stylesheet"> <title>TradeMine - Гарант Сервис Minecraft</title> </head> <body> <header class="header"> <div class="container"> &…

    Asked by Stomi32, February 10, 2022

    0 votes
    1 answer
18. Появляется отступ справа в мобильной версии

    Доброго времени суток! При переходе на сайт http://akkermanskiy.zzz.com.ua/ через телефон , появляется отступ справа. Подскажите пожалуйста , в чем проблема?

    Asked by Akkermanskiy, June 5, 2022

    0 votes
    2 answers
19. Вопрос об раскрытие блока

    Я сверстал часть сайта и у меня появился вопрос, при открытии спойлера blog_btn внутренности выталкивают заголовок за пределы блока. Как сделать так что-бы заголовок оставался на месте а внутрености разворачивались вниз а не вверх? https://drive.google.com/file/d/1_O-e0_79TNps-Oo7KJkgY8zQaDKRbIGF/view?usp=sharing

    Asked by Phanlom, September 2, 2022

    0 votes
    5 answers
20. Как сделать чтобы кнопки были на одной линии Listen, Watch, Read

    https://vasyldubno.github.io/project1/#blog https://github.com/vasyldubno/project1

    Asked by vasyl_runner, June 22, 2022

    0 votes
    1 answer
21. Как реализовать не обычную кнопку?

    Добрый день. Подскажите как правильно реализовать такую кнопку? Сложности возникли с этими углами( Подобные кнопки встречаются на сайте во многих местах и с разными размерами!

    Asked by Ant-tur, October 24, 2022

    0 votes
    2 answers
22. Высота блока

    Крч пытаюсь отредачить фотку на сайте, типо размер и положение, в html добавил <div class="Launcher"> <img src="assets/images/Launcher.png"> </div> дальше захожу в css и пытаюсь отредачить с помощью .Launcher {width: 100px;} Ну ничего не выходит, не хейтите впервые сайт делаю, Что я делаю не так друзья?

    Asked by Devor, August 2, 2023

    0 votes
    2 answers
23. Как сделать раздел "футер" в самом низу под таблицей?

    Как сделать футер в самом низу (Daniil Orlov знак копирайта). https://github.com/rgg877/Site/tree/main

    Asked by rgg877, September 8, 2023

    0 votes
    2 answers