@arzamas-nick

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

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

Ширина контейнера 1170px, и кнопки слайдера выходят за пределы этой ширины, как быть если у пользователя ширина экрана как раз 1170px ? (тогда ведь кнопки просто будут не доступны).

5c7814ace5005171195277.jpeg
  • Вопрос задан
  • 1002 просмотра
Решения вопроса 3
wapster92
@wapster92 Куратор тега Вёрстка
Создай брекпоинт примерно 1230пх и засунь их внутрь контейнера.
Ответ написан
SaveLolliPoP
@SaveLolliPoP
1 / 0 = ∞
<div class="parent">
      <div class="prev"> < </div>
</div>

<style>
.parent {
     position relative
}
nav {
    position absolute
    left -50px;
}
</style>


И контейнер не равен ширине экрана, если это конечно не сетка бустрап.
НА мобильной версии media сделайте, не знаю нужно ли на мобильной версии эти стрелки, наверное лучше скролить их пальцем.
Ответ написан
profesor08
@profesor08
Отрицательные значения для left, right спасут твое положение:

<div class="slider">
  <div class="button button-left"></div>
  <div class="button button-right"></div>
</div>

.slider .button {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}

.slider .button-right {
  right: -30px;
}

.slider .button-left {
  left: -30px;
}
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы
29 мар. 2024, в 17:04
5000 руб./за проект
29 мар. 2024, в 17:03
3000 руб./за проект
29 мар. 2024, в 16:58
3000 руб./за проект