Colonne di Boostrap 4 a dimensione fissa

Colonne di Boostrap 4 a dimensione fissa

C'è chi purtroppo non si accontenta mai di nulla, e deve rompere fino all'inverosimile.

E così mi è capitato di dover impostare delle dimensioni fisse ad una colonna della grdi di Bootstrap 4.

In sostanza, partendo da qui:

<div class="container-fluid">
    <div class="row">
        <div class="col-md-11"></div>
        <div class="col-md-1 sx_striscia"></div>
    </div>
</div>

La colonna sx_striscia risultava troppo larga (ho cercato di fargli capire che si chiama responsive); ho quindi dovuto modificare le proprietà flex della grid e modificare un pò l'HTML.

La struttura diventa così:

<div class="container-fluid">
    <div class="row">
        <div class="col"></div>
        <div class="col sx_striscia"></div>
    </div>
</div>

Il CSS è questo:

.sx_striscia {
    -ms-flex: 0 0 77px;
    flex: 0 0 77px;
    background-color: #fff265;
}

Le cose che mi pare di capire che fondamentali sono:

  • l'uso di container-fluid e non di container
  • l'uso delle col senza estensioni

Enjoy!




Share

Commentami!

About Mattepuffo.com

Blog dedicato all'informatica e alla programmazione!
Tutti i contenuti di questo blog, tranne casi particolari, sono sotto licenza Licenza Creative Commons Creative Commons Attribution-Noncommercial-Share Alike 2.5. .

2612 articoli
310 commenti
19 progetti
Altri link
  • About
  • Scrivimi
  • Copyright
  • Sitemap
  • matteo.ferrone@yahoo.it
  • GitHub
  • Privacy Policy