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

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

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

Почему не работает z-index в данном примере?

Почему серый квадрат не закрывает черного? #box { z-index: 1; // <-- если убрать то всё заработает margin: 50px; background: #ccc; width: 200px; height: 100px; position: ...
Cristian's user avatar
  • 597
1 голос
2 ответа
78 показов

Как выравнять элемент по центру?

Как выравнять элемент по центру, если у него display:inline-block, свойство text-align:center не работает. Структура что-то вроде такого <div class="parent"> <div class="event" style="...
Евгений's user avatar
2 голоса
1 ответ
5k показов

многостраничный сайт, как правильно организовать?

Делаю многостраничный сайт. Footer и Header (по советам из сети), думаю сделать в отдельном файле(шаблон) и при загрузке страницы подгружать(через js). Есть вопросы по поводу .sass файлов, получается ...
codecaramel's user avatar
3 голоса
1 ответ
109 показов

Не работает обтекание слева

Почему не работает обтекание слева для class="sidebar" /* Убираем отступы у списка */ ul { padding: 0; margin: 0; } ol { padding: 0; margin: 0; } .wrapper { margin-right:...
deekee's user avatar
  • 159
4 голоса
1 ответ
77 показов

Как можно создавать SVG фигуры около начала координат и потом помещать на нужное место

Мне нужно некоторое количество похожих фигур SVG разместить в разные места на экране. Фигуры различаются только размером, углом поворота и цветом, но сам контур одинаковый. Я хочу нарисовать эти ...
Дмитрий Полянин's user avatar
1 голос
1 ответ
2k показов

Обводка у кнопки

Как убрать обводку у кнопки, при применении на нее background-color ? .but { background-color: yellow; outline: none; } <input type="button" value="click" class="but">
Serp's user avatar
  • 23
0 голосов
0 ответов
41 показ

Как сделать на JavaScript дополнительный слой на имеющейся разметке

У меня есть готовый сайт уже с разметкой. На этом сайте есть некоторые div-ы. Я пишу модуль который случайным образом сгенерирует разные SVG фигуры и поместит их над фоном заданных div-ов, при этом ...
Дмитрий Полянин's user avatar
0 голосов
1 ответ
10k показов

Не растягивать flex по высоте

Как отменить растягивание блока search-box? body { margin: 0; padding: 0; box-sizing: border-box; font-size: 10px; } body .top { background-color: #ededed; margin-bottom: ...
Дмитрий Сухоцкий's user avatar
0 голосов
1 ответ
39 показов

Не работает css

* { padding: 0; margin: 0; } .header { background-color: #f6f2f2; overflow: hidden; } .margin160 { margin: 10px 160px; } .menu { background-color: #313030; height: ...
bad code's user avatar
  • 886
1 голос
1 ответ
62 показа

Как выровнять по вертикали меню сайта

* { padding: 0; margin: 0; } .header { background-color: #f6f2f2; overflow: hidden; } .margin160 { margin: 10px 160px; } .menu { background-color: #313030; height: 90px; } ....
bad code's user avatar
  • 886
0 голосов
2 ответа
196 показов

Проблемы с вертской background окрашивает не всё

Поставил background для класса header, но по бокам появляется белый фон: .header { margin-top: 0px; padding-top: 0px; background-color: #f6f2f2; } .menu { background-color: #...
Vlad467's user avatar
0 голосов
2 ответа
33 показа

jQuery .wrap Добавляет много класс

jQuery.noConflict(); jQuery(document).ready(function($){ $(".content .bbc").wrap('<div class="altwrap"/>'); $(".content .bbc").each(function() { $(this).after('<img onClick="forchangesrc()" ...
Erekle Maziashvili's user avatar
3 голоса
1 ответ
83 показа

Выравнивание элементов из разных дивов

Нужно выровнять блоки из разных дивов относительно друг друга в номерном порядке. Я ищу какое-то свойство, вроде order-group(<-- придуманное свойство), или что-то такое, чтобы можно было определить,...
EasyTactic's user avatar
1 голос
2 ответа
1k показов

как получить callback в конце css анимации?

По клику на элемент first добавляется стиль animation = "move 5s";. Как получить callback в конце css анимации, что бы обнулить стиль? Можно докидывать модификатор в виде класса у которого будут стили,...
Виталик Черный's user avatar
3 голоса
1 ответ
3k показов

Как можно упростить рейтинг звездочек, написанных на JS/jQuery?

Учу JS/jQuery, написал вот такой рейтинг(не без помощи стак). Как можно упростить js или jquery код(не добавляя одно в другое). P.S. Я думаю вопрос будет полезен и для тех кому нужны будут подобные ...
YourDeveloper's user avatar
3 голоса
2 ответа
3k показов

Как задать градиент у border и сделать его круглым

Есть кнопка и под кнопкой есть фон(картинка), нужно сделать градиент у border и сделать его круглым, и чтобы фон(картинка) была видна. Здесь фон непрозрачный у div. .rounded-corners-gradient-...
Maks's user avatar
  • 53
0 голосов
2 ответа
212 показов

Как выделить text-box красным?

Нужно если text-box пустой или вводит неправильно значение, вывести сообщение об ошибке и выделить его красным. Сообщение выводится, то что text box пустой. А текст бокс не меняется и сообщение о ...
ИВанов Иван's user avatar
1 голос
2 ответа
977 показов

Как перенести на следующую строчку блочный элемент

Привет!Мне нужно перенести надпись "Personal touch" на вторую строчку после иконки.Br не помогает так как это блочный элемент. <!DOCTYPE html> <html lang="ru"> <head> <meta ...
Oleksandr Tatarinov's user avatar
1 голос
2 ответа
27 показов

Как элементы задать alpha канал корректно. Проблема с разметкой

Помогите пожалуйста исправить дефект верстки. CSS: div.date { max-width: 100px; padding: 5px 20px 5px 30px; color:#ffffff; background: #000000; border-radius: 60px; filter:...
Anonymous's user avatar
  • 480
0 голосов
1 ответ
84 показа

Как реализовать переключение цветовых схем на сайте с помощью jquery так, чтобы после перезагрузки страницы цветовая схема не слетала...?

Как реализовать переключение цветовых схем на сайте с помощью jquery так, чтобы после перезагрузки страницы цветовая схема не слетала...?
Lamer's user avatar
  • 3
0 голосов
1 ответ
583 показа

Горизонтальная прокрутка блока div, у которого ширина указана в процентах

Есть таблица (table) с двумя ячейками (td), ширина которых 20% и 80% соответственно. Таблица занимает всю площадь веб-страницы. В меньшей из ячеек находится блок div, полностью занимавший её площадь. ...
nick's user avatar
  • 2,510
1 голос
2 ответа
197 показов

При определенном классе, меняется стиль другого блока

При клике на меню пункт получает класс .active и переходит на страницу где есть слева каталог. Нужно что бы при .cat-parent:nth-child(1).active каталог с классом .list-group менял background, к ...
Artem  Fomkin's user avatar
3 голоса
3 ответа
3k показов

HTML-CSS. Как добавить стрелку в этот код?

Как добавить в span ::before, также как на скрине? У меня в футере так: <div class="back-to-top-link"><a href="#top"><span class="arrow"></span>Top</a></div> ...
Артем's user avatar
1 голос
1 ответ
896 показов

Gulp выдает ошибку с кодом Sass

Привет!Я решил попробовать поверстать с препроцесором Sass но при компицяции кода я получаю вот такую ошибку [09:59:00] gulp-notify: [Error running Gulp] app\sass\_vars.sass Error: Invalid CSS after "...
Oleksandr Tatarinov's user avatar
1 голос
3 ответа
132 показа

Как можно сократить код js

$('.cat-parent:nth-child(1').hover(function() { // навели мышь на элемент $('header').css('box-shadow', '0 14px 24px rgba(82,56,115, 0.3)'); }, function() { // убрали мышь с элемента $(...
Artem  Fomkin's user avatar
1 голос
2 ответа
1k показов

Поведение кнопки при наведении на неё курсором

Здравствуйте! Нужно сделать так, с помощью css и html, чтобы при наведении на кнопку менялось название кнопки, например была кнопка "Заказать товар", а при наведении менялось на "Жми!". И каким ...
Nice's user avatar
  • 355
0 голосов
1 ответ
1k показов

Расположить иконку закрытия над картинкой

Использую Bootstrap 4, в верстке не сильно шарю. Как расположить кнопку закрытия (та, что внутри .close-image-icon) в правом верхнем углу картинки, то есть по сути над ней? <div> <span ...
rugleb's user avatar
  • 141
2 голоса
1 ответ
168 показов

Как при наведении и по щелчку на блоке менять изображение в нём?

Есть блок, в котором есть изображение, заголовок и описание. Как сделать так, чтобы при наведении на блок менялась картинка на другую, а по клику на блок, менялась картинка новую? Только CSS и HTML, ...
Vova Terentev's user avatar
2 голоса
2 ответа
5k показов

Ошибка в Koala! ArgumentError: invalid byte sequence in UTF-8 Use --trace for backtrace

ArgumentError: invalid byte sequence in UTF-8 Use --trace for backtrace Как исправить эту ошибку ?
Вадим's user avatar
3 голоса
3 ответа
468 показов

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

Есть 2 блока, в каждом из которых есть по картинке, по заголовку и по описанию. Выглядит это так Как можно сделать так без JS, JQUERY, FLEXBOX? В данном проекте использую display: table; .cards {...
Vova Terentev's user avatar
0 голосов
1 ответ
210 показов

Как убрать резкость при откате hover scale?

Для меня существует такая проблема: При наведении на картинку она увеличиваться при помощи scale(1.3) Но когда убираешь курсок, то картинка уменьшается резко, как сделать что бы картинка так же плавно ...
uzi_no_uzi's user avatar
  • 2,186
1 голос
3 ответа
1k показов

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

.content { margin: 0 auto; width: 1100px; } .left { width: 70%; margin-right: 60px; display: inline-block; } .right { width: 20%; background-color: #8c5d79; ...
Vova Terentev's user avatar
0 голосов
1 ответ
224 показа

input type range [закрыт]

Здравствуйте,как стилизировать input type range,чтобы он стал таким?
Danil Sereda's user avatar
1 голос
3 ответа
351 показ

Проблема с версткой, как вставить блок в блоке

Вопрос к гуру верстки. body, html { margin: 0; padding: 0; } .wrapper { margin: 0 auto; } .header { height: 10%; background: #009e9d; } .content { background: #...
Anon8's user avatar
  • 695
2 голоса
3 ответа
4k показов

Многостраничный сайт. Подключение шапки и подвала

Как организовать подключение шапки и подвала на страницы в сайте, чтобы постоянно не писать их? Без использования php
Optimus's user avatar
  • 664
6 голосов
2 ответа
376 показов

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

Как можно реализовать такой элемент?
Vova Terentev's user avatar
0 голосов
1 ответ
121 показ

Управление содержимым div

function toggle(imgElem, divId) { if (document.getElementById) { var divElem = document.getElementById(divId); if (divElem.className == "closed") { divElem.className = "opened"; ...
Diffuzor's user avatar
4 голоса
1 ответ
2k показов

grid-row, не могу понять почему не работает

Есть простой код: https://codepen.io/Vdodovych/pen/VQoYJy .grid { display: grid; } .items { grid-template-columns: 1fr 1fr 1fr; grid-gap: 20px; } .items div:nth-child(2) { ...
Саша Вдодович's user avatar
1 голос
0 ответов
60 показов

Как создать всплывающую подсказку определённой формы?

Доброго времени суток! Нужно создать всплывающую подсказку определённой формы как на картинке: Также подсказка должна выводиться строго под серединой кнопки и не зависить от положения курсора ...
Борис Ельцин's user avatar
0 голосов
0 ответов
117 показов

Как сделать столкновение двух анимированных блоков?

Пожалуйста помогите понять две вещи: 1.Как добавить столкновение двух анимированных <div> блоков? 2.К примеру у нас есть комната с хаотично-движущимися шарами(div-блоками). Как сделать так, ...
Sumrakvnochi's user avatar
0 голосов
0 ответов
209 показов

Прокрутка изображения при прокрутке страницы с трансформацией

Суть следующая, есть устройство, смотрящее на посетителя под углом. Хочу вставить в него изображение и имитировать прокрутку страницы. Выглядит это вот так: Вот картинка страницы для теста. То есть, ...
Alexey Giryayev's user avatar
0 голосов
1 ответ
164 показа

Smartgrid, flexbox, расстановка элементов

Нужно сделать вот такой блок: Что получается у меня: Препроцессор Less, но думаю здесь это не важно) Код: .back { background: #222222; .items { display: flex; flex-wrap: wrap; ....
Денис Доня's user avatar
0 голосов
1 ответ
946 показов

CSS padding для table-row

Здравствуйте, уважаемые специалисты, помогите с проблемой, очень нужно. Есть таблица из div-ов в ней одна колонка и несколько строк, вот упрощенный вид: .vcom_tab {display:table; border-collapse:...
Игорь Саламов's user avatar
-1 голос
1 ответ
538 показов

Как отключить определенные компоненты Bootstrap 4?

Не использую некоторые компоненты Bootstrap 4, такие как модальные окна, кнопки и т. п. Встал вопрос: как их можно отключить?
Михаил Р.'s user avatar
0 голосов
0 ответов
145 показов

Использование отдельного CSS файла для Header в Ruby on Rails

Проект на Рельсах. Подключен Bootstrap. Делаю отдельно Header для сайта. Но как использовать css файл только для Header? В папке /app/views/layout создал _header.html.erb где сама структура меню. В ...
Серега Бондаренко's user avatar
-1 голос
1 ответ
198 показов

CSS тень на соседний блок [закрыт]

Как сделать тень шапки так, чтобы она была на всех блоках ниже, которые стоят вплотную?
Денис Подоляченко's user avatar
0 голосов
1 ответ
4k показов

Кнопка поверх изображения-ссылки

У меня есть картинка, которая является ссылкой. Нужно добавить поверх этой картинки кнопку так, чтобы ссылка-картинка не потеряла своей функциональности, а нажатие на кнопку не инициировало нажатие на ...
rokoman13's user avatar
0 голосов
1 ответ
523 показа

Сделать "Колесо" или "Барабан"

Не знаю как правильно назвать) как можно сделать такую штуку (каждый столбик можно прокручивать отдельно колесом мыши или соотв. пальцем) ? Похожая штука есть у Яндекса Демо , но разобраться не смог(
Сергей Козин's user avatar
0 голосов
2 ответа
275 показов

Не знаю как сделать оверлей

Очень простая задача сделать оверлей загнала в тупик. Мне в принципе не приходит идея, как это осуществить. Нужно при наведении на картинку показывать оверлей с ссылкой посередине. По наведению на ...
Silento's user avatar
  • 2,853
0 голосов
0 ответов
33 показа

CSS у класса jumbotron не отображается [дубликат]

Стиль класса не изменяется .jumbotron{ padding: 20px 30px; margin: 10px; background-color: rgba(15, 117, 189, 0.2); } Как исправить? .jumbotron{ padding: 20px 30px; margin: ...
ИВанов Иван's user avatar