Вопросы с меткой [css]

CSS, или каскадные таблицы стилей, — формальный язык описания внешнего вида документа, язык стилей, определяющий отображение HTML-документов.

Фильтрация
Сортировка
Метки
0 голосов
0 ответов
20 показов

Как правильно обеспечить работу Z-index между страницей и iframe?

На сайте есть окно(div), оно должно быть поверх iframe блока, но внутри iframe тоже есть окна, некоторые из которых должны быть поверх этого первого окна. Как правильно это реализовать, чтобы ...
manking's user avatar
  • 6,331
1 голос
1 ответ
28 показов

Почему при нажатии на popup он закрывается?

Открытие popup происходит хорошо, но когда я нажимаю на содержимое popup например на один из input то он сразу закрывается, как я это могу решить? const openButtonProduct = document....
Moty's user avatar
  • 11
0 голосов
0 ответов
35 показов

Как плавно заполнить background у div-а?

Есть блок, который на странице выглядит так: Html выглядит так: <div class="relative rounded-full rating_border overflow-hidden h-9 bg-grey-100 mb-3"> <div class="bg-primary ...
F. Tomas's user avatar
  • 743
0 голосов
1 ответ
26 показов

Подскажите в чем проблема. Ошибка ERR_FILE_NOT_FOUND при появлении картинки в окне

При нажатии на галерею изображений, должно всплывать фото в отдельном окне , но почему то при нажатии происходит ошибка ERR_FILE_NOT_FOUND <div class="container-gallery"> <...
imo717's user avatar
  • 23
0 голосов
0 ответов
17 показов

Как стилизовать яндекс карту?

Подскажите возможно ли так стилизовать яндекс карту? или какие-то стили сделать будет невозможно? api читал, но карты так некогда не стилизовал, только базово(поменять цвет, иконку и тд) https://i....
powerg's user avatar
  • 79
0 голосов
1 ответ
36 показов

Как растянуть input на всю ширину родителя?

Есть у меня форма и wrapper. Даю wrapper-у display:flex; Даю form-е max-width: 480px; и input-ам даю width:100% но инпуты не растягивается на всю ширину. <div> <form> <input type=&...
Dias's user avatar
  • 45
0 голосов
1 ответ
8 показов

SASS не работает один класс

Делаю сайт, в header есть вот такой текст, разбитый на два класса main и secondary. <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> &...
Илья's user avatar
1 голос
2 ответа
25 показов

Как сделать одинаковую высоту слайдов в Slick Slider

Всем привет! Я попробовал уже много способов решения этой проблемы, но так и не смог решить её. Мне необходимо, чтобы высота слайдов в slick slider была одинаковой и соответственно зависела от высоты ...
Arseniy's user avatar
  • 67
-4 голоса
1 ответ
60 показов

Анимация плавного появления при скролле

Как сделать такую анимацию чтобы при скролле вниз она плавно появлялась, а при скролле верх она плавно исчезала. Пример:
whoismatvei's user avatar
0 голосов
1 ответ
48 показов

Как зафиксировать объекты при масштабировании

Кусочек кода HTML <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, ...
Minimus's user avatar
0 голосов
1 ответ
21 показ

Как сделать рамку так чтобы одна часть была над другим элементом а другая под другим элементом?

Всем привет. Помогите пожалуйста сделать рамки как на картинке, так чтобы одна часть была над другим элементом а другая под другим элементом ?
Ahmed_08's user avatar
0 голосов
0 ответов
40 показов

Как изменить код, чтобы на клике кнопки "Так" в модальном окне добавлялся товар, по которому сделан клик?

Учусь React, помогите пожалуйста class App extends Component { state = { data: [], cards: [], carts: [], favoriteCards: [], isModalOpen: false, ...
Stud's user avatar
  • 61
0 голосов
0 ответов
30 показов

Как сделать календарь?

Подскажите пожалуйста как сделать в календаре дату по месяцам правильно? у меня сейчас до 32 числа почему-то выдает. Но число в input выводится правильно. Спасибо const calendar = document....
powerg's user avatar
  • 79
0 голосов
1 ответ
39 показов

Как сделать чтобы блок скролился мышкой в overflow-hidden

Возникла проблема. Не пойму как сделать, чтобы блок скролился внутри блока с overflow:hidden. Я нашел решение на реагирование с колесиком мышки, но как сделать, чтобы реагировало на перетаскивание ...
Pavel 's user avatar
  • 191
0 голосов
1 ответ
24 показа

Как сделать, чтобы контейнер было видно только внутри карточек

Есть контейнер, внутри (или поверх) которого располагаются карточки. Вопрос в том как сделать так, чтобы пространство между карточками было белым (или просто не отображался контейнер) а внутри самих ...
Arkeviz's user avatar
0 голосов
1 ответ
22 показа

Как сделать счетчик ввода значений?

Подскажите пожалуйста как реализовать счетчик значений как на фото https://i.stack.imgur.com/nZiNw.png . Получается что в input можно писать только 1 цифру, и инпуты как-бы открываются по очереди ...
powerg's user avatar
  • 79
0 голосов
0 ответов
28 показов

progress steps bar [закрыт]

Необходимо сделать прогресс бар по шагам. + на каждый ваш появляется блок и информацией. Не могу ничего толком найти и не получается сделать
Владислав Кулик's user avatar
0 голосов
0 ответов
25 показов

Слайдер с анимацией отступа между элементами

возникла проблема с анимированием слайдера. На скриншотах принципе весь процесс виден. При скролле слайдера, должен появляться отступ между элементами, как гармошка, Используется библиотека (на данный ...
keltias's user avatar
-1 голос
1 ответ
44 показа

Анимация текста как у Spotify

Подскажите, как сделать такую анимацию?
whoismatvei's user avatar
0 голосов
1 ответ
40 показов

Высота ребенка по всю высоту скролла родителя + абсолютный блок

Если внутри скролла есть элемент с абсолютной позиций (.absolute), он расширяет высоту скролла переполненного родителя (.overflow), но контент (.content) при этом не расширяется, как сделать что-бы ...
Mr_Epic's user avatar
  • 1,903
-1 голос
0 ответов
43 показа

Активный меню ul li по центру

Как сделать активный меню по центру, в мобильной версии, активный меню отображается вне экрана можно сделать так, чтоб активный отображался по центру .sub-categories { display: -webkit-box; ...
mat's user avatar
  • 103
0 голосов
1 ответ
9 показов

Карточки слайдера slick

Такая проблема, верстаю карусель из карточек, используя slick. Сам слайдер работает, но я хочу, чтобы карточки меняли резиново свои размеры (ширина, высота, font-size) Подскажите, как правильно это ...
Egor's user avatar
  • 1
0 голосов
1 ответ
27 показов

CSS проблемы с ::before

на оригинальном сайте, при наведении на ссылку в меню, появляется зеленая полоса, индивидуальная для каждого элемента списка. Я скопировал оттуда стили, но у меня полоса сплошная на весь родительский ...
Tutti Frutti's user avatar
1 голос
0 ответов
56 показов

Выровнять элементы

Всё никак не могу выровнять элементы, при одних размерах внутренних элементов кажется, что все отлично, но когда добавляю больше содержимого, то некоторые псевдоэлементы перестают стыковаться и всё ...
Denis's user avatar
  • 77
0 голосов
0 ответов
33 показа

Как разместить или нарисовать эту линию на сайте?

В макете была эта черная линия,что на заднем плане,но я не знаю как ее разместить,буду благодарен за помощь (P.s эта линия обведена на скрине синим бордером)
Sywuxy's user avatar
  • 19
0 голосов
0 ответов
19 показов

Как обратиться через один объект к другому? Кнопка крестик для закрытия формы [закрыт]

Верстаю сайт на 1c-umi, функционал очень ограничен. Мне доступен только css файл и то, не в полном виде. Костылями пытаюсь сделать кнопку закрытия формы обратной связи. Проблема в том, что не ...
MARK inc.'s user avatar
1 голос
0 ответов
23 показа

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

Как отцентровать блоки в последней строке грида, при условии, что блок динамичный и количество элементов может меняться? Собственно, интересует, есть ли вообще такое решение у грида, не рассматривая ...
Александра Иванова's user avatar
0 голосов
1 ответ
39 показов

Как работает градиентый текст в данном случае?

Объясните, пожалуйста как работает градиентный текст? background: var(--third-gradient); -webkit-background-clip: text; background-clip: text; color: transparent; Что записывается в background? ...
mindcontrol's user avatar
0 голосов
1 ответ
33 показа

Почему не получается прижать грид элемент полностью к верху?

Есть вот такой блок нужно чтоб кнопки переключение слайдов прижимались к верху прописываю им align-self: start; они все ровно не становятся в самый верх когда вместо start ставлю end все роботает как ...
Женя's user avatar
2 голоса
1 ответ
34 показа

У h1 появляется margin после подключения normalize, но я сбрасывала отступы с помощью *

В css пишу *{ box-sizing: border-box; margin: 0; padding: 0; } Подключаю normalize.css и из него у h1 появляется margin: 0.67em 0px; А по макету мне нужен только margin-top: 53px ...
Рита's user avatar
0 голосов
1 ответ
27 показов

Почему мой фон отображается только на одной части сайта

У меня есть часть кода в css и html: * { padding: 0; margin: 0; box-sizing: border-box; scroll-behavior: smooth; } body { font-family: 'Oswald', sans-serif; } ::selection { ...
Issa's user avatar
  • 1
0 голосов
1 ответ
45 показов

Почему-то перестало работать подчеркивание + счетчик

Html/Css/Js код : let inputData = document.querySelector('#inputTask'); let btnAddTask = document.querySelector('#btn-add'); let ulList = document.querySelector('#list'); let spans = document....
данила неймарк's user avatar
0 голосов
1 ответ
31 показ

Как изменить модульное окно, чтобы оно открывалось в этой же вкладке (css+html)

Модульное окно в той же вкладке не открывается по кнопке. Чтобы его открыть нужно нажать на правую кнопку мыши, потом выбрать "открыть в новой вкладке" перейти на эту новую вкладку и только ...
Анастасия Полозова's user avatar
0 голосов
0 ответов
35 показов

Как вынести выпадающее меню из overflow: auto?

Есть меню, при переполнение меню, оно уходит вправо и появляется скролл(написанный на js), при клике на меню со стрелочкой выпадает список, но когда появляется скролл список не открывается. Подскажите ...
powerg's user avatar
  • 79
4 голоса
2 ответа
46 показов

Как убрать границы у блоков с определённых сторон?

Как убрать границу в некоторых местах? В местах скругления границы расходятся: Также нужно продлить верхнюю границу первого элемента: .company-items { margin: 0 100px; } .company-items-...
Denis's user avatar
  • 77
1 голос
1 ответ
33 показа

Как выровнять кнопки CSS?

Не могу понять, как в моём случае сделать кнопки на одном уровне. Перепробовал много вариантов, но кнопки так и не выровнялись. .package-items { margin-left: 40px; margin-right: 40px; } ....
Denis's user avatar
  • 77
0 голосов
1 ответ
27 показов

Navbar не растягивается всю ширину экрана

При вёрстке navbar'a столкнулся с проблемой, что он не растягивается во всю ширину экрана. <style> .navbar { overflow: hidden; background-color: #6A6666; position: ...
Beirym's user avatar
  • 74
0 голосов
3 ответа
38 показов

Почему появляется вертикальный скролл?

Объясните пожалуйста почему появляется вертикальный скролл и как избавиться от него ? HTML: * { margin: 0px; padding: 0px; } a { text-decoration: none; } html { width: 100%; ...
denikotin's user avatar
0 голосов
1 ответ
16 показов

Не работает SlickSlider в Chrome

Суть проблемы. Если запускаю сайт "Go Live" через VSCode, то всё отлично работает. Но если открываю сам файл index.html из папки, то слайдер перестаёт работать. В чём может быть проблема??
Владислав Кулик's user avatar
0 голосов
1 ответ
20 показов

как изменить размер linear-gradient

Как сделать чтоб вот это подчеркивание было не больше чем само слово ( чтоб оно начиналось с первой буквы и доходила до последний,не реньше и не дальше ) .navlist a:hover span /*, .gorod:hover*/ {...
Bebrik's user avatar
  • 1
0 голосов
2 ответа
28 показов

justify-content: space-around; - как при нечетном количестве блоков выставить последний элемент под левый блок над ним?

"Детский вопрос", но не помню ответа.Есть "main" с "flex-flow: wrap;" "justify-content: space-around" с нечетным кол-вом блоков внутри по 2 на строчку. Как ...
Burr_DI's user avatar
  • 122
0 голосов
0 ответов
25 показов

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

Как сделать плавный блок if (json['success']) { $('#content').before('<div class="alert success__add">' + json['success'] + ' <button type="button" class="icon-close ...
mat's user avatar
  • 103
0 голосов
0 ответов
32 показа

Увеличение элемента в границах его самого

Подскажите, пожалуйста, как сделать так, чтобы при наведении на элемент img он увеличивался в своих границах и не залазил на соседние элементы? С левой стороной элемента я разобрался, а вот с правой ...
Anton N's user avatar
0 голосов
0 ответов
18 показов

Swiper slider не переключается слайд в thumbs

Cлева в thumbs, слайды по стрелочкам переключаются только до третьего, но если нажать на сам слайд или на стрелочку которая находиться на главном экране, то все работает. Помогите сделать чтобы в ...
whoismatvei's user avatar
0 голосов
0 ответов
25 показов

Как разделить блочные элементы со свойством display: flex

Нужно разместить div: row и nav в разные строки. Код выгдядит так: body { margin: 0; overflow-x: hidden; } .footer { width: 100%; background: #000; padding: 30px 0px; font-family: '...
Monika's user avatar
  • 1
0 голосов
1 ответ
17 показов

Не могу поставить все в один ряд

body{ margin: 0; padding: 0; } .anim{ width: 100%; height: 150px; background-color: aqua; } nav li{ display: inline-block; margin-right: 20px; } <div class="logo"&...
Человек's user avatar
0 голосов
2 ответа
32 показа

Как правильно применить overflow: hidden?

Выполняю свой первый челлендж, и не могу понять, как сделать так, чтобы скрыть белые уголки контейнера, которые появляются после применения border-radius к элементу. Код ниже, он может быть немного ...
Anton N's user avatar
0 голосов
2 ответа
29 показов

Как затемнить только картинку не затемняя элементы

display: flex; flex-direction: column; background-image: url(./-u3Qb8K_PDg.jpg); height: 100%; width: auto; flex-grow: 1; background-repeat: no-repeat; background-position: ...
Александр's user avatar
0 голосов
0 ответов
16 показов

WordPress убрать расстояние после хедера

Делаю сайт на WordPress + Woocomerce и столкнулся с такой проблемой. На всех страницах отступ после хедера регулируется при помощи Elementor'а и выглядит нормально. Пример ниже. Однако на страницах ...
D1NoooS's user avatar
0 голосов
1 ответ
20 показов

Не получается подгрузить стили через WebPack

Я пытаюсь подключить шрифты на WebPack но он их не видит. Скачал шрифты, настроил sass и css, но шрифты не подгружает. не могу понять в чем проблема вот конфиг моего WebPack const HtmlWebpackPlugin = ...
Виктор Иванов's user avatar