very good,
I am looking for a series of containers not to jump lines when they reach the right edge of the screen. I am interested in having a horizontal scroll, in such a way that when this scroll moves, I can see the content of the web.
The problem is that when, for example, 4 occupy more than the width, the last line jumps down, and it is something that I intend to avoid. How could I do it?
Thank you very much in advance
--Edit--
An example of the code
<div id="contenedor">
<div class="contenido">Lorem Ipsum...</div>
<div class="contenido">Lorem Ipsum...</div>
<div class="contenido">Lorem Ipsum...</div>
<div class="contenido">Lorem Ipsum...</div>
<(div>
and the css
#contenedor{
display: block
}
.contenido{
display: inline;
width: 100%
}
The way to do it with
flex
would be something like:To the parent container we assign the
flex
y propertynowrap
. On the other hand, one must be definedwidth
for each child container, otherwise the maximum width is adjusted by default to the viewport.This link is a good guide to understand the use of flex and what it can do.