Горизонтальная прокрутка при больших изображениях с центровкой изображения

vladd56 · June 2, 2016

Здравствуйте!

Есть изображение размером 1900px/528px.

Надо чтобы горизонтальная прокрутка появлялась при размере экрана 1170px с центровкой изображения.

Мой код:

<!DOCTYPE html>
<html lang="ru">
<head>
	<meta charset="UTF-8">
	<title>Горизонтальная прокрутка</title>	
	<style>
	*{
	padding: 0;
	margin: 0;
}
.main_background{
width: 2000px;
height: 528px;
background: url(http://i6.imageban.ru/out/2016/06/01/c4c0656fcf6bac97bc7bd0541a995b87.jpg) no-repeat;	
}

.main_background
{	
	/*width: 100%;*/
	position: relative;	
	left: 50%;
	margin-left: -950px;

	min-width: 1160px;
	max-width: 1900px; 
	overflow: hidden;	  
}
body,
.scroll{
	/*	margin: 0 auto;
	min-width: 1169px;
	max-width: 1900px;
	border: 1px solid transparent;	*/
}	

	</style>
</head>
<body>
	<div class="main_background">
	<div class="scroll"></div>	

	</div>	
</body>
</html>

За комментированы мои попытки добиться результата. Имею только центровку изображения или горизонтальный скролл при 1170px. Вместе не могу соединить. Подскажите кто что знает. Есть ли решение этой задачки?

klierik · June 2, 2016

https://jsfiddle.net/klierik/ypf5x7er/1/

vladd56 · June 2, 2016

Спасибо за ответ. Всё так просто оказывается.

А где можно поблагодарить за ответ и за скорость ответа?

klierik · June 2, 2016

10 минут назад, vladd56 сказал:

А где можно поблагодарить за ответ и за скорость ответа?

Данная функция появляется для пользователей определенных групп (переход в которые автоматический при достижении определенного кол-ва сообщений). Это описано в правилах.

Sign In

Горизонтальная прокрутка при больших изображениях с центровкой изображения

Question

vladd56

Link to comment

Share on other sites

3 answers to this question

Recommended Posts

klierik

Link to comment

Share on other sites

vladd56

Link to comment

Share on other sites

klierik

Link to comment

Share on other sites

Join the conversation

Обсуждения

Forums

Important Information