как сделать div прокручиваемым только по горизонтали

#html #css

#HTML #css

Вопрос:

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

 link1
 link2
 link3



 
 некоторый контент
 

 некоторый контент
 

 некоторый контент
 

Комментарии:

1. здесь link1, link2, link3 являются элементами вкладки, и они имеют соответствующее содержимое вкладки.

2. Пожалуйста, поделитесь соответствующими частями вашего кода.

Ответ №1:

 overflow-x: scroll;
overflow-y: visible;
 

Ответ №2:

Вы можете достичь этого, просто используя.

 display: flex;
flex-wrap: nowrap;
 
 .container {
  display: flex;
  flex-wrap: nowrap;
}
.content {
  min-width: 200px;
} 
 <div class="container">
  <div class="content">
    link1
  </div>
  <div class="content">
    link2
  </div>
  <div class="content">
    link3
  </div>
</div> 

Комментарии:

1. @AnkitaAdhikari добро пожаловать. Пожалуйста, одобрите мой ответ, если это работает для вас. Рад, что и у вас есть преимущество.

Ответ №3:

Вы можете использовать overflow-x :

 .container {
  overflow-x: scroll;
  overflow-y: auto;
  width: /*chosen width*/;
}