Я пытаюсь заставить мой DIV отображать только горизонтальную полосу прокрутки. Я заполняю DIV большим количеством изображений и хочу, чтобы пользователь мог прокручивать только по горизонтали.
Но у меня есть две проблемы:
Один урок, который я прочитал, дал мне некоторый код (которого у меня больше нет), который говорит, что он отобразит полосу прокрутки. Но это не так. И это также заставило изображения появляться друг под другом. Поэтому я удалил этот код.
Другой учебник дал мне «внешний вид», который я хотел, , но без полос прокрутки . Но полосы прокрутки должны были появиться!
Как мне получить DIV, полный картинок и горизонтальную полосу прокрутки?
Вот что у меня есть:
CSS: (dude.css)
.EditorialImagePaneOne
{
width: 500px
-ms-overflow-x:scroll;
overflow-x:scroll;
white-space:nowrap;
}
.ShowcaseImage
{
height: 407px;
}
HTML: (Index.html)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<link rel="stylesheet" href="../Assets/CSS/dude.css" />
<title></title>
</head>
<body>
<div class="EditorialImagePaneOne">
<img src="../Assets/Images/Editorial/1-1.jpg" class="ShowcaseImage" />
<img src="../Assets/Images/Editorial/1-2.jpg" class="ShowcaseImage" />
<img src="../Assets/Images/Editorial/1-3.jpg" class="ShowcaseImage" />
<img src="../Assets/Images/Editorial/1-4.jpg" class="ShowcaseImage" />
<img src="../Assets/Images/Editorial/1-5.jpg" class="ShowcaseImage" />
<img src="../Assets/Images/Editorial/1-6.jpg" class="ShowcaseImage" />
<img src="../Assets/Images/Editorial/1-7.jpg" class="ShowcaseImage" />
<img src="../Assets/Images/Editorial/1-8.jpg" class="ShowcaseImage" />
</div>
</body>
</html>