For example, I have a header and some content part on my site. How to make it so that when you change the screen expansion, both header and content always remain on the same line, that is, do not disperse. `

<header> <div class="content-header"> <div class="container-fluid"> <div class="row align-items-center justify-content-center header-content"> <div class="col-md-auto"> </div> <div class="col-md-auto"> </div> <div class="col-md-auto"> </div> </div> </div> </div> </header> <section class="main-section"> <div class="container-fluid"> <div class="row justify-content-center"> <div class="col-md-auto"> </div> <div class="col-md-auto"> <form class="main-section-form" method="POST" action="/form.php" > </form> </div> </div> </div> </section>

    1 answer 1

    You can specify the same column values ​​in the header and content. But then you have to write the values ​​for each of the sizes (xs / sm / md / lg). You have col-md-auto aligns in Header and content differently, as the content may vary. You can make values, for example: col-3 col-6 col-3 in header and content. Then col-3 will stand up exactly under col-3 ... Only because of this, depending on the content, different values ​​will have to be registered (xs / sm / md / lg). But the same for header and content.

    • And what values ​​are we talking about? - Pavel Bogdanov
    • You have col-md-auto aligns in Header and content differently, as the content may vary. You can make values, for example: col-3 col-6 col-3 in header and content. Then col-3 will stand up exactly under col-3 ... Only because of this, depending on the content, different values ​​will have to be registered (xs / sm / md / lg). But the same for header and content. - kirill