Новые ответы с меткой

1 голос
Принятый

css: адаптивный размер текста (в зависимости от ширины блока)

это максимум, а так он может и 20 и 12 в зависимости от ширины блока в зависимости от ширины блока конечно не получилось (получилось от ширины viewport'а, но т.к. сам блок 100%, считайте что это одно ...
  • 2,716
0 голосов

Как сделать контейнер имел max-width таким, чтобы левая часть была с отступом, а правая шла через весь экран

Надеюсь в цветах блоков разберётесь и ширину я уменьшил, что бы здесь отображалось корректно. body { margin: 0; } div { display: block; } .wrapper { background-color: gray; display: grid; }...
1 голос
Принятый

как в css для grid-а плюсануть к fr pixel

Переведу для Вас этот ответ на англоязычной версии SO: Единица fr не является стандартной длиной, как проценты или пиксели. Онa представляет собой только остаточное пространство. Следовательно, fr ...
1 голос

Реализовать поиск по скрытому списку ul -> li

Если следовать логике работы поиска по приведённой в вопросе ссылке, то желательно немного поправить разметку и переписать скрипт: let categoriesAll = [...categories.children]; /* Развернуть/...
  • 31k
1 голос

анимированное Меню бургер

Типа этого? .navbar__hamburger { display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 2px; height: 32px; width: 32px; ...
0 голосов

CSS-анимация с нажатием "Наведи на меня"

Можно воспользоваться "смежными селекторами" (+), комбинаторами если угодно. .block { position: absolute; width: 600px; height: 50px; background: rgb(199, 199, 199); top: 100px;...
  • 2,716
1 голос

CSS-анимация с нажатием "Наведи на меня"

.block { position: absolute; width: 600px; height: 50px; background: rgb(199, 199, 199); top: 100px; left: 600px; } a { display: flex; justify-content: space-around; } a::after { ...
0 голосов
Принятый

Углы для контейнера

Используйте псевдоэлементы, как фон, применив к ним clip-path (Вы можете изменить размер, ухватив блок за правый нижний угол): /* For example only --> */ body{margin:0;min-height:100vh;display:...
  • 31k
1 голос

Почему при изменении позиции меняется ширина у абсолютно позиционированного элемента?

Когда вы изменяете позицию элемента с абсолютным позиционированием, вы также изменяете его начальную точку (или точку отсчета), относительно которой рассчитываются его размеры и позиционирование. В ...
1 голос

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

Ну вот так получилось через grid body { margin: 0; width: 100vw; height: 100vh; display: grid; align-items: center; background-color: #000; overflow: hidden; color: #fff; font-...
0 голосов

По стандарту html, в ul можно вложить только списки li?

Только li. А чтобы проверить, будет что-то ошибкой или нет, надо вставить разметку в w3c validator.
  • 120k
2 голоса
Принятый

Выбрать элемент селектором CSS

Возможно ли при такой структуре обратиться к .agreement__rect, если чекбокс активен? Как вариант - использовать такой селектор. У меня в Опере 96.0.4693.50 - работает. .agreement__label:has(:...
  • 3,294
1 голос
Принятый

Ширина правого блока в приоритете

Запретить блоку сжиматься при помощи flex-shink: 0 (или как в примере ниже через flex). .gl { display: flex; } .left { background: lavender; } .right { background: navajowhite; flex: 90% ...
  • 5,301
3 голоса
Принятый

Не работают stroke-dasharray, stroke-dashoffset

Учитывая то, что у Вас в анимации есть значение infinite, код должен быть примерно таким: .animation-pigeon { fill: none; stroke: red; stroke-width: 16px; stroke-dasharray: 3600; stroke-...
  • 31k
0 голосов

Липкий первый столбец, липкая шапка и горизонтальный скролл в таблице

Думаю, что просто задать "липкость" всем первым потомкам в строках будет достаточно: .table-container { width: 500px; overflow-x: auto; } .table { border-spacing: 0; } tr > * { ...
  • 31k
0 голосов

Не работает :last-of-type

Просто обращайтесь не к a:last-child, а к li:last-child a { color: black; text-decoration: none; } .footer__link-list li:last-child .footer__link { color: orange; font-weight: bold; } &...
  • 1,439
0 голосов

Как обратиться к элементу внутри элемента?

Для применения стилей к каждому n-ному элементу li внутри ul, можно использовать псевдокласс :nth-child(). Например, чтобы применить стили только к четным элементам li, можно использовать следующий ...
1 голос
Принятый

Выбрать определенный элемент селектором css

Выбор элементов a, для которых родительским элементом (>) является span, которому предшествует (~) элемент a a~span>a { color: red } <div class="breadcrumbs-wrapper"> <div ...
1 голос
Принятый

Как сделать полупрозрачную внутреннюю рамку у clip-pah элемента?

Как вариант, можно использовать еще один элемент (или псевдоэлемент) с полупрозрачным фоном и clip-path, дающим обратную фигуру. Примерно так (с пикселями поиграйте сами): П.С. правильно "hexagon&...
1 голос
Принятый

Как убрать нижнюю грань в materialize при нажатии на input

Скорее всего, это свойство border-bottom. Чтобы убрать достаточно установить его значение на none
  • 36
1 голос
Принятый

Необходимо перенести выпадающее меню на передний план

Вам нужно указать для .main-head z-index:1 или больше.
  • 982
0 голосов

Почему появляется резкий переход от последнего слайда к первому в Slick Slider?

Решил путем добавления следующих стилей: /* slide when not active/center*/ .slick-slide[aria-hidden="true"]:not(.slick-cloned) ~ .slick-cloned[aria-hidden="true"] { transform: ...

50 лучших ответов включены