Как заставить горизонтальную полосу прокрутки появляться?

Question

Рассмотрим следующий код :

HTML:

<div id="wrapper">
    <div class='a'></div>
    <div class='a'></div>
    <div class='a'></div>
    <div class='a'></div>
    <div class='a'></div>
</div> 

CSS:

#wrapper {
    width: 300px;
    border: 1px solid black;
    overflow: auto;
}
.a {
    width: 70px;
    height: 70px;
    border: 1px solid red;
    float: left;
}   

Как я мог заставить горизонтальную полосу прокрутки появляться вместо отображения красных делителей во второй строке?

Answer 1

Попробуйте:

#wrapper {
  width: 300px;
  border: 1px solid black;
  overflow: auto;
  white-space: nowrap;
}
.a {
  width: 70px;
  height: 70px;
  border: 1px solid red;
  display: inline-block;
}

Это даст вам интервал между внутренними делителями - поместите их все в одну строку, чтобы удалить их.