Как растянуть фоновый блок только вправо до конца ширины страницы?

Question

[Роман Родионов]

Хочу сделать как в шаблоне:


Мой блок уезжает за экран на величину левого отступа!
codepen.io/RRodionov/pen/OMNKoE

Как сделать, чтобы он заканчивался в конце экрана?

Answer 1

[Murat Atila]

Вам надо что-то типа такого? codepen.io/theexplay/pen/rxeXRO?editors=110

Comments

[Роман Родионов]

В общем-то да.
А что есть я задам overflow: hidden; для body? Вроде работает. Не будет неожиданных последствий?

[Murat Atila]

честно говоря, на body не советую, не могу припомнить как таковых косяков, но я вообще избегаю вешать лишние стили на body.
Но если другого варианта нет, то вешайте на body конечно.

[Роман Родионов]

Как теперь скроллить по горизонтали, если окно браузера маленькое? Или если свернул окно в половину. У мена скролл не появляется..

[Murat Atila]

Роман Родионов: вместо overflow, используйте overflow-x

[Роман Родионов]

Я его и использую, по горизонтали не скролится. Overflow-x ведь блокирует прокрутку по горизонтали.

Answer 2

[Vlad Tytcky]

float:right- решает

.wrapper {
  float:right;
  width: 600px;
}

.block {
 height: 70px;
  width: 100%;
  background-color: grey;
}

ну или можно через position:absolute-задать right:0 и все

Comments

[Роман Родионов]

.wrapper мне нужен для задания ширины сайта и выравнивания контента на странице по центру.
Если использовать float:right, то весь контент уедет вправо.
Если задать right:0, то .block займет 100% страницы. А мне нужно, чтобы он начинался от начала враппера и заканчивался в конце экрана.