1

В общем, есть блок содержимое которого вполне влазит в него, но сам блок не влазит на страницу, position у него стоит fixed. У общей старницы есть скролл, но нужно добавить отдельный скролл этому блоку т.к. он не уходит вверх при пролистывании главной страницы. Сколько не пытаюсь реализовать - все в пустую, так что даже скинуть код с какими-то наработками не могу. Буду благодарен за любую помощь.

1
  • То есть по сути, если блок не влазит на страницу, мне нужно динамически обрезать его высоту, пока он не влезет, а скролл уже тогда сам появится
    – mmfsy
    23 сен 2016 в 16:15

1 ответ 1

3

Вы, возможно, не знаете про свойства top, right, bottom, left для фиксированных и абсолютных элементов. Если задать для фиксированного элемента top: 0 и bottom: 0, то он растянется по высоте страницы от верха до низа и в таком случае не нужно будет ничего динамически обрезать.

Чтобы внутри элемента появился скролл, для него нужно выставить overflow: auto

html{height: 100%;}
body{margin: 0; height: 100%;}
			
.fixed{position: fixed; top: 0; bottom: 0; right: 0; width: 200px; background: #B0C4DE; overflow: auto;}
<!DOCTYPE html>
<html>
	<head>
		<title>test</title>
		<meta charset="UTF-8">
	</head>
	<body>
		<div style="height: 2000px;">Контент сайта</div>
		<div class="fixed">
			<div style="height: 2000px;">Контент фиксированного блока</div>
		</div>
	</body>
</html>

Ваш ответ

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

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