Atomic.css

Aus QBWiki
Version vom 20. Februar 2019, 12:07 Uhr von Pascal (Diskussion | Beiträge) (Die Seite wurde neu angelegt: „<syntaxhighlight lang="css"> Flexbox CSS Classes: .flex, .flex > p { display: flex; } .flex-row, .flex-row > p { flex-direction: row; } .flex-col,…“)
(Unterschied) ← Nächstältere Version | Aktuelle Version (Unterschied) | Nächstjüngere Version → (Unterschied)

Zur Navigation springenZur Suche springen
/* Flexbox CSS Classes */

  .flex, .flex > p { display: flex; }
  .flex-row, .flex-row > p { flex-direction: row; }
  .flex-col, .flex-col > p { flex-direction: column; }
  .flex-sb, .flex-sb > p  { justify-content: space-between; } 
  .flex-sa, .flex-sa > p  { justify-content: space-around; } 
  .flex-se, .flex-se > p  { justify-content: space-evenly; } 
  .flex-fs, .flex-fs > p  { justify-content: flex-start;}
  .flex-fe, .flex-fe > p  { justify-content: flex-end;}
  .flex-wrap, .flex-wrap > p { flex-wrap: wrap; }
  .flex-nowrap, .flex-nowrap > p { flex-wrap: nowrap; }

/* Margins and Paddings */
  .m-0 { margin: 0px; }
  .m-5 { margin: 5px; }
  .m-10 { margin: 10px; }
  .p-0 { padding: 0px; }
  .p-5 { padding: 5px; }
  .p-10 { padding: 10px; }