Quiero crear un área de desplazamiento horizontal para los móviles. y quiero que sea asi: 
Y también quiero ocultar la barra de desplazamiento.
¡Intenté esto pero hay un problema con eso y no puedo darles ancho!
<div style="overflow: auto hidden; display: flex;" id="v"> <div> <img src="url" style="width: 100%; height: 20%;" alt=""> <p>name</p> </div> </div>Para hacer la barra de desplazamiento horizontal
.container { overflow: auto hidden; };Para ocultar el uso de la barra de desplazamiento:
.container::-webkit-scrollbar { display: none; }Tal vez ayude. Uso overflow: auto;
#carousel { width: 80%; height: 200px; background-color: green; overflow: auto; white-space:nowrap; } #carousel .slide { display: inline-block; } <div id="carousel"> <div class="slide"> <img src="https://via.placeholder.com/300x150"/> </div> <div class="slide"> <img src="https://via.placeholder.com/300x150"/> </div> <div class="slide"> <img src="https://via.placeholder.com/300x150"/> </div> <div class="slide"> <img src="https://via.placeholder.com/300x150"/> </div> <div class="slide"> <img src="https://via.placeholder.com/300x150"/> </div> <div class="slide"> <img src="https://via.placeholder.com/300x150"/> </div> <div class="slide"> <img src="https://via.placeholder.com/300x150"/> </div> <div class="slide"> <img src="https://via.placeholder.com/300x150"/> </div> </div>