0

Есть следующий макет - http://prntscr.com/fxhby1

введите сюда описание изображения

Синий фон нужно спозиционировать так чтобы на его фоне была надпись войти, пробовал сделать через linear-gradient, но проблема в том что при увеличении или уменьшении экрана блок перемещается, то влево то в право. - background-image: linear-gradient(to right, #fff 70%, #2a7fe0 30%).

Так же пробовал сделать псевдо селектор для контейнера, но проблема в том что слайдер не входит в контейнер.

1 ответ 1

1

Немного не понял в какой контейнер не входит слайдер, но псевдоселектором сделать можно так:

header {
  height: 300px;
  background: #ddd;
  position: relative;
}

header:before {
    content: '';
    display: block;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 50%;
    right: 0;
    margin-left: 80px;
    background: #2a7fe0;
}

.centered {
  position: relative;
  width: 320px;
  min-height: 200px;
  margin: -250px auto 0 auto;
  background: #999;
}
<header></header>
<div class="centered">test</div>

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.