Вопросы с меткой [вёрстка]

Вёрстка (HTML-вёрстка, Вёрстка веб-страниц) — процесс формирования веб-страниц на языке разметки гипертекста (HTML) с использованием каскадных таблиц стилей (CSS).

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

Картинка заслоняет уголки у блока

Сделал у текстового блока уголки с помощью двух прямоугольников псевдоклассов При изменении z-index у изображения оно начинает закрывать уголки Код: *{ margin: 0; padding: 0; } :root{ ...
Dmitry's user avatar
  • 107
0 голосов
1 ответ
8 показов

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

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

Некорректно работает свойство height:100% для дочерних элементов

Не совсем понимаю поведение height:100% для дочерних div-ов. Есть вот такой простой пример кода: html, body {margin:0;padding:0;} .main-wrapper { height: 100vh; } .section { background: grey;...
nvse's user avatar
  • 370
-1 голос
0 ответов
54 показа

Как сверстать таблицу?

Всем привет. Подскажите как сверстать данную таблицу и можно ли ее сделать в таком виде.(картинка ниже) Основные проблемы: 1)с фиксацией левой колонки и шапки таблицы, лучше бы без использования js; 2)...
user551040's user avatar
0 голосов
0 ответов
25 показов

Почему не получается переопределить background-color

В зависимости от состояния, блок должен менять цвет. Все нечетные блоки имеют цвет $smoky-white, а блоки в состоянии open должны иметь цвет $platinum. Проблема в то, что у &:nth-child(odd) блоков ...
Vadim Mokrushin's user avatar
0 голосов
0 ответов
15 показов

Как Swiper'у задать центральный слайд?

В Swiper есть настройка "centeredSlides: true,", но она применяется сначала к первому слайду и при этом остается пустое место слева. Как задать настройку "centeredSlides: true," с ...
Burr_DI's user avatar
  • 122
0 голосов
2 ответа
55 показов

Как сделать такой вырез в фоне [закрыт]

подскажите как сделать такой вырез в виде восьмёрки у фоновой заливки
MihailShumilov's user avatar
0 голосов
1 ответ
27 показов

Кнопка фильтр работает не правильно

Вот сценарий. Сайт перезагружен, все элементы показаны(не отфильтрованы) нажимаю на кнопку-фильтр например "Машины", видно в devtools что класс добавляется , НО реакции нету, не фильтруются ...
Patrick's user avatar
  • 11
2 голоса
3 ответа
68 показов

Возможно ли на CSS реализовать прямоугольник как на картинке (куча линий заполнящих блок)

Тренируюсь в верстке, нашел такой макет. Скажите пожалуйста, возможно ли так заполнить блок не прописываю куча линий вручную? Или это обязательно картинка? Заранее всем огромное спасибо)
Danil's user avatar
  • 37
0 голосов
0 ответов
13 показов

Как сделать фиксированные пробелы для детского издания в InDesign, чтобы не возникало "коридоров"?

Я верстаю детское издание 6+ (2-я возрастная категория). ГОСТ устанавливает норму пробела с кегль шрифта. В качестве пробела установил круглую шпацию, но визуально пробелы получаются слишком большими. ...
German Gorodnev's user avatar
0 голосов
1 ответ
56 показов

Как ограничить ширину span по фактически занимаемому буквами пространству?

В span есть стрелочка сортировки, она позиционируется абсолютно относительно span. Но когда происходит перенос строки, то образуется промежуток между тестом span и стрелочкой. Мне нужно, чтобы span ...
Vadim Mokrushin's user avatar
0 голосов
0 ответов
38 показов

Неверно рассчитывается ширина столбцов Grid в WPF

При запуске окна с установленным SizeToContent="WidthAndHeight" столбцы должны занимать ровно по половине ширины окна, но на самом деле получается так, что первый столбец занимает больше ...
Artem's user avatar
  • 1
0 голосов
0 ответов
11 показов

Реальное разрешение окна браузера для верстки мобильной версии сайта

Для верстки мобильной версии сайта использую браузерную эмуляцию мобильных устройств. Там есть разные устройства с указанным разрешением: iPhone 4 с разрешением экрана 320х480px; iPhone SE с ...
FrontEnder007's user avatar
-1 голос
1 ответ
36 показов

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

.table { /* border-collapse: separate; */ border-spacing: 12px; border: none !important; margin: 0; width: unset; position: relative; } .center-col { position: relative; background: ...
user551040's user avatar
0 голосов
1 ответ
21 показ

Верстка Bootstrap. Blade

Имеется представление. И пользуется bootstrap. Проблема заключается в том, что первый элемент при переборе отображается криво. В чем может быть причина? Код представления <div class="row&...
Moon's user avatar
  • 1
-1 голос
2 ответа
51 показ

Линейный градиент через CSS + фоновая картинка

Встала задача с версткой вот такой карточки: Изначально делал через background-image с добавлением иконки и линейного градиента, но возникла проблема, когда стало необходимо реализовать hover, при ...
Artem Kornishon's user avatar
1 голос
1 ответ
34 показа

Почему height:100% не работает в данном случае? [закрыт]

Вот у меня есть контентная часть, которую я с помощью стиля 'flex' расположил автоматически между хедером и футером(в нем пока нет контента), мне нужно расположить секцию welcome до конца экрана, я ...
Matvey Androsyuk's user avatar
0 голосов
0 ответов
17 показов

Кодогенераторы для Figma?

Подскажите, кто использует какие-то кодогенераторы поверх Figma? Какие-то плагины? *Раньше верстал psd шаблоны из Avocode и Zeplin, там была возможность контролировать переменные, работа с ...
BlackStar1991's user avatar
0 голосов
3 ответа
62 показа

Как отключить полосу прокрутки для навигационной панели в HTML/CSS?

Есть шаблон страницы, содержащей навигационную панель и контент отдельными блоками. При переполнении страницы в content появляется полоса прокрутки, которая задевает navbar. Сама полоса прокрутки ...
ego_xxx's user avatar
  • 359
0 голосов
1 ответ
58 показов

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

Какими способами можно сверстать каплю снизу блока чтобы в ней был background-image блока? Интересует несколько возможных решений
ptrv-dev's user avatar
0 голосов
2 ответа
70 показов

Как сверстать по сетке уходящий в бок элемент

Пытаюсь сверстать эту часть, получается через одно место, не понимаю как это нормально верстать по дизайнерской сетке. В моём случае сеткой выступает .container Есть вариант левый и правый элемент ...
Михаил Камахин's user avatar
0 голосов
1 ответ
41 показ

Сделать фон во всю ширину за контейнером

При масштабировании страницы фон липнет к одному краю и уезжает. Это нормально? Нужно будет адаптировать под такой размер или можно растягивать картинку в нормальном положении? .container { ...
fropid's user avatar
  • 1
0 голосов
1 ответ
36 показов

CSS Нестандартный text-align, как выровнять?

При верстке с шаблона столкнулся с таким не стандартным выравниванием текста. Анализатор psd шаблона сломался, и показывает невалидное значение text-align: justifyLeft; Подскажите, пожалуйста, как ...
BlackStar1991's user avatar
0 голосов
2 ответа
56 показов

Кнопка живет своей жизнью html

Как сделать чтобы кнопка находилась под последним вводом? main #osn #feedback { height: 600px; padding-top: 20px; clear:both; } main #osn #feedback input { width: 40%; margin-...
Mulidon o-о's user avatar
0 голосов
1 ответ
15 показов

Bootstrap под разные разрешения

Можно ли под разные разрешения использовать свойства bootstrap?чтобы к примеру к одному и тому же объекту было применено свойство одного типа, но под разные разрешения.подскажите пожалуйста
богдан's user avatar
0 голосов
0 ответов
33 показа

Помогите доделать многоуровневое меню

const contents = document.querySelectorAll('.content'); const menu = [...document.querySelectorAll('.menu *:not(.head)')]; document.addEventListener('click', (event) => { const node = event....
user547704's user avatar
0 голосов
1 ответ
41 показ

Верстка карточки товара

Ребят в чем проблема? Пытаюсь сверстать карточку товара по макету. В итоге не могу центрировать по вертикали изображение внутри блока. Верхний значек процентов я оформил, его дает центровать только ...
fropid's user avatar
  • 1
0 голосов
2 ответа
35 показов

Сделать фон больше размера container

Подскажите как сделать фон таким образом. Контент находится в container 1500px. Размер блока с фоном 1700px. Пробовал делать такую конструкцию <orange-background> <container> </...
fropid's user avatar
  • 1
0 голосов
0 ответов
15 показов

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

Есть экран. Когда показывается клавиатура, некоторые элементы скрываются за ней и за блоком с кнопкой и текстом, которые прижаты к ней (скрин) Но я пытаюсь реализовать скролл в случае, если какие-то ...
faritowich's user avatar
0 голосов
0 ответов
14 показов

Как сделать иконку к просмотренной ссылке?

У меня такой вопрос, как мне сделать не просмотренную ссылку(1) и просмотренную ссылку(2), как на картинке. Я конечно понимаю, что это скорее всего легко реализуемо, но мне честно нужна помощь. ...
TheDude's user avatar
0 голосов
1 ответ
37 показов

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

Есть такой pen: https://codepen.io/stn28/pen/ExepRrp Кому неудобно лазить на сторонние ресурсы, вот пример: * { box-sizing: border-box; } .wrapper { position: relative; border: 1px solid ...
28 Lucky's user avatar
0 голосов
0 ответов
14 показов

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

Всем доброго дня, у меня имеется навигация на сайте используя id и , но так как хедер у меня фиксированный сверху, выходит что при подходе к блоку, он занимает какую-то часть места и выглядит не очень ...
Alexseusik's user avatar
0 голосов
1 ответ
38 показов

Выпадает ли position absolute из DOM?

Я смотрел ролик про позицинирование в css. Автором была сказана такая мысль, что когда элементу применяется абсолютное позиционирование, то он как бы выпадает из DOM дерева, аналогично как это ...
28 Lucky's user avatar
0 голосов
1 ответ
74 показа

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

По стандарту html w3c в ul на первом уровне вложенности могут быть только списки li? Или можно вложить любой другой элемент и это не будет ошибкой? Просто случайно заметил что у меня в коде в ul ...
28 Lucky's user avatar
0 голосов
0 ответов
29 показов

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

Есть такой код: https://codepen.io/stn28/pen/VwGdmyo <div class="menu"> <div class="block-1">Кино</div> <div class="block-2"> <ul> ...
28 Lucky's user avatar
0 голосов
0 ответов
26 показов

Как реализовать задачу из макета

обучаюсь верстке , возник такой вопрос есть макет: https://www.figma.com/file/rnIAwsECd4Qxltrz2p4NJa/Ветклиника?node-id=0%3A1&t=aPkamyHowD0px2qc-0 В нем имеется блок "История пациентов", ...
AstRR's user avatar
  • 1
0 голосов
0 ответов
28 показов

HTML Заголовки становятся ссылками

Почему-то HTML заголовки ссылаются на якорь cities. Вроде бы все парные закрыл. <!DOCTYPE html> <html lang="ru"> <head> <meta charset="UTF-8"> <...
Иван Цветков's user avatar
0 голосов
0 ответов
27 показов

Самый оптимальным вариантом создания сайдбара по прежнему является float?

Ребята, создавать сайдбары все также лучше с помощью float-ов? Flex'ы не лучшее решение для них, а грид не такой кроссбраузерный как float и гриды конечно для более сложных случаев. Я прав, или мое ...
28 Lucky's user avatar
0 голосов
0 ответов
28 показов

Почему в сафари круг становится овалом?

У меня есть вот такой круг, при медиа запросе на max-width для него он уменьшается как положено, но становится овалом. Почему так? &__value-circle { width: 380px; height: 380px; ...
Роман Березенко's user avatar
0 голосов
0 ответов
23 показа

Не работает @media-запрос

При вёрстке срабатывает @media на первом изображении: А при открытии сайта на ноутбуке не работает @media-запрос на втором: Может быть, задаю не правильный @media-запрос. Если так, то подскажите ...
Кирилл's user avatar
0 голосов
1 ответ
41 показ

Видео поверх iframe

никак не могу понять, как добавить видео, поверх другого? Например есть iframe с видео из Ютуба, как поверх этого ifram'a добавить другое видео с ютуба, затем по окончанию открывалось другое? То, ...
vortec's user avatar
  • 3
-1 голос
1 ответ
22 показа

Не подскажите, как реализовать эффект скролла спаралксом

Подскажите пожалуйста, как на реакте реализовать, скролл как на этом сайте, с помощью каких библиотек? www.studiorhe.com/
Rybin's user avatar
  • 35
1 голос
1 ответ
26 показов

Как сделать правильно списки

Всем привет. Нужно сделать два дива .list с двумя колонками списка и что-бы они делили пространство между собой, но возникает одна проблема, когда в первом диве .list текста мало во втором списке, то ...
Teoom07's user avatar
  • 59
0 голосов
1 ответ
35 показов

Адаптированные отступы

Всем привет. Можно ли как-то задать адаптированный размер margin/padding для элементов? Чтобы при уменьшение экран также уменьшались отступы. Например как max-width: 1200 для блоков. Не получается ...
Teoom07's user avatar
  • 59
0 голосов
0 ответов
10 показов

Почему в vue transition на блок не работает

Хотел чтобы при hover div блок менял цвет но это происходить слишком быстро добавил transition:.4s но все равно transtion не работает <template> <div class="about " id="...
Azizbek Islombekov's user avatar
1 голос
0 ответов
39 показов

Контент в три колонки на flexbox

Всем доброго времени. Есть код, в нем конечно каша, но помогите у кого есть возможность разобраться как сделать. Необходимо меню как на сайте https://www.ey.com/en_gl чтобы табами было. Табы вроде ...
Denis's user avatar
  • 33
1 голос
1 ответ
31 показ

Помогите с вёрсткой блока на HTML + CSS

Учусь вёрстке. В одном из бесплатных макетов есть такой блок: Не знаю, как сделать так, чтобы все блоки, а также линии, идущие к ним, были расположены правильно. Было предположение, что для ...
user avatar
0 голосов
1 ответ
32 показа

Сверстать треугольную инфографику с динамическими данными

Есть задача сверстать такого типа инфографику, однако я в ступоре, как это сделать без абсолютов и canvas Подскажите пож, как это лучше реализовать?
Андрей Чистяков's user avatar
0 голосов
2 ответа
40 показов

как при клике выводить конкретный элемент массива?

let song1 = document.querySelector('song_1'); let song2 = document.querySelector('song_2'); let song3 = document.querySelector('song_3'); let song4 = document.querySelector('song_4'); let song5 = ...
100.1's user avatar
  • 5
2 голоса
1 ответ
52 показа

Как реализовать анимацию появления кривых линий?

При загрузке страницы , должны появляться линии по направлению точки(левые направо , правые налево), в конце анимации ,на каждой появляется точка.
Profet's user avatar
  • 387