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

Позиция относится к расположению элемента относительно его контейнера, как правило, на горизонтальной и вертикальной осях.

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

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

У меня есть react-компонент, в котором есть блок Ему в scss задан position fixed, дабы он оставался на месте, но он двигается при заполнении контентом страницу. Как это решить? // LeftMenu import { ...
Daniil Andreev's user avatar
0 голосов
1 ответ
36 показов

У элемента установлено значение position: fixed; но при просмотре страницы на мобильных устройствах элемент уезжает вверх при скролле

Есть сайдбар у с классом "sidebar". Когда я в браузере я открываю эмуляцию мобильных устройств сайдбар уезжает вверх во время прокрутки несмотря на position: fixed;. Помогите пожалуйста. ...
Mezzanine's user avatar
0 голосов
2 ответа
31 показ

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

В приложении есть горизонтальный RecyclerView в котором происходит выбор карточки в виде карусели, где главный элемент занимает центральную позицию. Как можно получить индекс текущей позиции объекта ...
AnWa's user avatar
  • 23
0 голосов
0 ответов
10 показов

Помощь в вёрстке, реализация изображений на сайте

Нашёл макет из открытого доступа, так как я новичок в этом деле, помогите пожалуйста как правильно реализовать данный блок с картинками... Ладно если бы просто картинки, но между ними есть связующая ...
Nilpy 's user avatar
  • 11
0 голосов
1 ответ
26 показов

Абсолютно позиционируемый элемент не игнорирует margin/padding родителя

Почему элемент с position: absolute; не игнорирует margin/padding родителя с position: static;? body { margin: 0; } .container-static { width: 1160px; height: 200px; margin: auto; ...
FrontiR's user avatar
0 голосов
0 ответов
36 показов

Почему z-index работает странным образом?

Честно говоря, проблему я уже решил, причем сам и случайно. Но мне стало интересно, почему это сработало именно так: Есть контейнер и псевдо :before к нему, вот строки: .slide-1__content { ...
Emil Gerz's user avatar
0 голосов
2 ответа
36 показов

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

По курсу web разработчик я сверстал свой первый макет. Перед тем, как продолжить курс, я решил закрепить свои знания и сверстать ещё один макет, но уже полностью сам. Что ж, я встретился с новой ...
Nerdy's user avatar
  • 5
0 голосов
0 ответов
24 показа

shadow dom элемент и проблемы со sticky шапкой

Есть сайт, с элементом, который имеет z-index: 30 и position:fixed и находится в shadow dom. Элемент крепится к шапке сайта с position:sticky и z-index: 10. Ожидается, что меню, которое находится в ...
Coloradoprod's user avatar
0 голосов
1 ответ
61 показ

не работает z-index для дочерних элементов [закрыт]

.healthcare-card { padding: 37px 0; box-shadow: 0px 4px 18px rgba(88, 126, 236, 0.18); border-radius: 8px; display: flex; flex-direction: column; align-items: ...
Алекс Шах's user avatar
0 голосов
0 ответов
26 показов

Как поставить <p> справа рядом с картинкой в div?

Как в поставить рядом справа с картинкой? она находится по нижней грани картинки и не хочет подниматься наверх. <!DOCTYPE html> <html> <head> <link rel="...
NewSmartCoder's user avatar
0 голосов
0 ответов
40 показов

Почему img позиционируется относительно элемента у которого не задан position

У меня есть слайдер, в котором я хочу сделать увеличение картинки при удержании, но картинка позиционируется относительно .slider__line, а не .slider let body = document.querySelector('body') let ...
samiro's user avatar
  • 1
0 голосов
0 ответов
33 показа

Блоки 'плавают', css html

делаю дизайн авторизации и регистрации. И при изменении масштаба страницы блоки заходят на границу других блоков. Вот фото: Вот код: ''' <!DOCTYPE html> <html lang="en"> <...
Al Dv's user avatar
  • 27
0 голосов
0 ответов
97 показов

Как сделать чтобы хедер с position: absolute не прилипал к экрану при сжатии?

На данный момент моя разметка выглядит следующим образом: <header class="header"> <div class="header__inner"> <a href="" ...
Flain's user avatar
  • 1
0 голосов
0 ответов
34 показа

div не расстягивается на всю ширину экрана при заданом position: fixed/absolute

Здравствуйте. Нужно сделать шапку сайта,с ссылками по центру, поверх остальных блоков, но если задать position: fixed/absolute, то шапка не на всю ширину получается, а прилипает к левому краю вместе с ...
Ander's user avatar
  • 1
0 голосов
2 ответа
32 показа

Как правильно задать условие в function appendP

let block = document.createElement(`div`); block.className = `block`; block.id = `blockId`; block.style.margin = 0; block.style.position = 'absolute'; block.style.left = `${Math.floor((window....
Марсианин Джон's user avatar
-3 голоса
1 ответ
614 показов

Unity 3D: Как можно сделать так чтобы при движении мыши по оси Y, объект изменил свою позицию по оси Z. (движение объекта мышкой.)

На данный момент объект изменяет свою позицию только по X и Y, хочу сделать так чтобы вместо движении по Y, объект двигался по Z. public class ClickDetector : MonoBehaviour { public GameObject ...
Arthur Davtyan's user avatar
1 голос
1 ответ
37 показов

Как позиционировать большое количество элементов с помощью flexbox не прибегая к position: absolute?

Делаю лэндинг для отработки технологии flexbox. Столкнулся с проблемой: не могу понять, как позиционировать большое количество элементов не прибегая к костылям вроде того, что я изобразил на втором ...
Omar T.'s user avatar
  • 43
0 голосов
1 ответ
54 показа

Как исправить разную позицию у псевдоэлементов, CSS?

Есть три одинаковых блока, с текстом. Текст представлен псевдоэлементом и повернут на 90 градусов. Но почему-то каждый элемент после первого смещен, как это исправить. Ниже ссылка для наглядного ...
Vitaliy's user avatar
  • 341
0 голосов
1 ответ
145 показов

position relative перекрывает нижестоящте элементы

#container{ position: relative; } #container canvas{ position: absolute; left: 0; top: 0; } <div id="container"> <canvas id="cnvBg" width="1200" ...
axmed2004's user avatar
  • 916
0 голосов
0 ответов
40 показов

Как реализовать?

.wide-block { height: 468px; background-color: #f4f4f4; position: absolute; left: 0; right: 0; display: flex; z-index: -3; &__discount { position: relative; background-...
Aliana's user avatar
  • 43
0 голосов
2 ответа
33 показа

как склеить два элемента?

как склеить два элемента, помеченные зеленой галочкой(синий и красный)? при том, что сам белый блок под ними имеет абсолютное позиционирование. Знаю, что можно задать для каждого top, right и так ...
Aliana's user avatar
  • 43
0 голосов
1 ответ
45 показов

CSS (JS) позиционирование HTML объектов

Итак, есть объект - div, который очень хотелось бы разместить по центру видимой области. Уточняю - по центру той зоны, куда смотрит пользователь по верх всех объектов что имеются. Со вторым я ...
GreenOwl's user avatar
0 голосов
1 ответ
13 показов

Как осуществить translate картинки с добавлением значения? [закрыт]

Приветствую. У меня есть проблема с добавлением значения (целочисленного) в пикселях к уже существующему значению позиции. Тоесть, вкратце, мне нужно, чтобы картинка сдвинулась по итогу со своей ...
Kurio's user avatar
  • 1
0 голосов
2 ответа
61 показ

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

У меня есть горизонтальное меню. По нажатию на один из элементов в этом меню - открывается новое выпадающее меню, выполненное как flex-блок. <!-- на этот пункт надо нажать, чтобы открылось меню --&...
Павел Прахов's user avatar
2 голоса
1 ответ
132 показа

Как сделать чтобы позиция элемента была равна позиции "thumb" input на JS?

Учу JS, сделал range slider, все работает более-менее. Когда ползунок на 50% тогда все ок, но когда значение больше или меньше 50%, то позиция счетчика числа, который появляется сверху, уже не равна ...
Vitaliy's user avatar
  • 341
0 голосов
1 ответ
234 показа

Съезжает картинка

У меня имеется div (stories), в котором находится много div'ов (story), в которых находится либо img картинка, либо video видео. <div class="stories"> <div class="story"...
Chursinov's user avatar
0 голосов
2 ответа
42 показа

Блок внутри другого блока. Обтекание или вырезание

Нужно разместить блок first_block (зеленый) внутри блока second_block (черный), так чтобы блок second_block обтекал первый блок first_block или вырезал место под него место. Если использовать position:...
Manu's user avatar
  • 3
1 голос
0 ответов
113 показов

Почему не работает position: fixed?

Хочу сделать эффект увеличительного стекла в Реакте. Надо, чтобы при наведении "стекла" на текст, внутри этого "стекла" отображался увеличенный текст. Есть параграф с обычным ...
Shoshanna's user avatar
0 голосов
2 ответа
44 показа

Не вижу элемент border в div. position fixed

Приветы! Как здорово что есть такой сайт! Я здесь впервые. К делу! На сайте сделал вверху фиксированную панель навигации и хочу видеть её с рамкой, но не получается отобразить её. Что ни так пишу в ...
Dmitriy's user avatar
0 голосов
1 ответ
57 показов

окно с фоном и полосой прокрутки

Нужно сделать окно с фиксированным (не двигающимся) фоном (png изображение) и прокручивающимся текстом внутри него (обычный скролл текста вверх вниз). Так же у окна должна быть кнопка закрытия (png ...
Мартынов Олег's user avatar
1 голос
2 ответа
2k показов

CSS: Высота блока, зависящая от ширины

Описанное реализовано тут: https://codepen.io/Coder10000000000/pen/MWvjOpR Есть два блока - левый и правый. У левого фиксированная ширина в пикселях. У правого - всё оставшееся пространство. При этом ...
Unicode101's user avatar
0 голосов
1 ответ
74 показа

Стилизация дочерних элементов в зависимости от родителя

Допустим, у нас есть такая HTML структура: <div class="parent1"> <div class="child"></div> </div> <div class="parent2"> <div ...
moonsharm's user avatar
0 голосов
1 ответ
50 показов

android позиция recyclerview при прокрутке изменяется

есть проблема с recyclerview есть recyclerview в котором есть названия тестов и есть массив выполненных тестов рядом с recyclerview отображается оценка за тест поиск оценки идет в адаптере в методе ...
dimasta68's user avatar
0 голосов
2 ответа
120 показов

Почему sticky-блок игнорирует координаты left и right?

Мне нужно растянуть блок поиска так, чтобы он был на всю ширину экрана. Этот блок помещен в main-контейнер с заданной шириной, видимо, поэтому не работает sticky-блок, однако, он же должен вести себя ...
BERTOLDO's user avatar
  • 445
0 голосов
2 ответа
383 показа

Как фон хэдера(прозрачный) сделать поверх другого фона который относится к другой секции?

У меня фон шапки накладывается на другой фон, и при этом при смене разрешений(мобилька-планш-вусктоп)шапка не должна съезжать... Я использую позишн абсолют, но возможно дело в том что позиционирую от ...
ZdraviSmisl's user avatar
2 голоса
2 ответа
37 показов

CSS: какое значение left надо задать дочернему элементу, чтобы он выходил за пределы родителя ровно на свою ширину?

Есть родительский блок с position: relative и дочерний с position: absolute (изначально он скрыт и появляется при наведении на родителя). Нужно, чтобы он выходил за край родителя ровно на свою ширину. ...
Danila's user avatar
  • 930
0 голосов
0 ответов
27 показов

Как выровнять их без костылей?

Есть два блока и их нужно как-то выровнять по центру. https://jsfiddle.net/ert2x0u1/19/ .con { border: 2px solid red; max-width: 700px; height: 200px; margin: 0 auto; display: flex; ...
Arrov192's user avatar
1 голос
1 ответ
28 показов

Пожалуйста помогите отрефакторить html css код

Не судите строго, я знаю что здесь палка на палке.... Помогите пожалуйста написать простой грамотный код. .content { display: flex; margin: 0px 0px 0px 100px; } .whether { width: 190px; ...
Илья Мельник's user avatar
0 голосов
1 ответ
54 показа

Непонятные пробелы HTML

Между блоками HTML появились какие-то непонятные пробелы, которые я не могу убрать HTML: <html> <head> <link rel="stylesheet" href="style.css"> <link ...
Blazzerrr's user avatar
  • 127
0 голосов
2 ответа
272 показа

css: можно ли перемещать дочерние элементы внутри родительского чтобы размер родительского элемента автоматически изменялись

подскажите, есть ли возможность не выставлять "вручную" точные размеры родительского блока перемещая внутри данного родительского блока дочерние (через position: relative или transform: ...
Zhihar's user avatar
  • 37k
-1 голос
1 ответ
376 показов

Позиция объекта не меняется

В скрипте я создаю объект, добавляю ему родителя canvas и привязываю к нему изображение. Я хочу, чтобы он оказался в позиции (x,y,z), но изображение (а значит и объект) появляется в центре экрана и не ...
Alex Cosmic's user avatar
1 голос
1 ответ
51 показ

Не получается правильно позиционировать элемент после нажатия кнопки

У меня есть меню, которое по нажатию кнопки, выезжает вправо на 250px, сдвигая основной контент на такое же значение. Я не могу правильно обработать нажатие кнопки, чтобы при нажатии она тоже ...
Руслан Мамедов's user avatar
0 голосов
1 ответ
104 показа

Странно работает position absolute при добавлении через JS

При добавлении position:absolute вручную к классу burger__line линии преобразуются в крестик. При добавлении position:absolute через JS к классу burger__line линии не преобразуются в крестик. ...
Dmitriy's user avatar
  • 11
0 голосов
0 ответов
37 показов

Перестал работать position:sticky

Такая проблема, у меня перестало работать position: sticky, не знаю из-за чего, делал правки, но вроде не трогал этот участок кода. Сам сайт, где оно пока что работает: 1-min.ru. Вот сам код: ...
Azik Show's user avatar
0 голосов
0 ответов
109 показов

В position: sticky; не захватываются ссылки

На первый взгляд всё работает нормально, опускается, поднимается и т.д., но при опускании, ссылки которые были в блоке перестали работать. Компьютер их просто не видит, для него они остались на том ...
Ансар's user avatar
0 голосов
1 ответ
35 показов

Не могу выровнять элемент. Как исправить?

Пытаюсь сделать иконку для гамбургер-меню и выровнять ее с помощью флексов. Но не выходит: иконка уходит куда-то вправо, появляется непонятный отступ сверху. Вот код: * { margin: 0; padding: 0;...
Eva's user avatar
  • 1,859
1 голос
1 ответ
257 показов

Почему z-index не работает при position:relative?

У меня есть простенький слайдер. В первом случае, я использую position: absolute, во втором – position: relative. 1. POSITION:ABSOLUTE – работает * { margin: 0; padding: 0; text-align: ...
Eva's user avatar
  • 1,859
0 голосов
1 ответ
162 показа

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

Есть flex контейнер в котором блок div с текстом и абсолютным позиционированием. Не могу понять почему текст в блочном элементе не растягивается на всю ширину, а занимает 2 строки.. Если убираю ...
Вася's user avatar
  • 4,478
0 голосов
2 ответа
36 показов

Попеременно выводить елементы DOM на экран

Есть следующий код <h1 onclick="showCard(event)">img1</h1> <h1 onclick="showCard(event)">img2</h1> <div class="images" id="img1">&...
faceVB's user avatar
  • 311
1 голос
2 ответа
560 показов

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

Первый элемент абсолютно позиционированный, второй – нет. Я задаю второму элементу верхний марджин, который равен высоте абсолютно позиционированного элемента для того, чтобы "обычный" ...
Eva's user avatar
  • 1,859