/where-css

Primary LanguageCSS

Where.css 1.0

A simple lightweight css framework

Includes:

  • Reset file
  • Color presets
  • Flexbox layout

Documentation

Auto generated by chatGPT

CSS Styling

The following is a collection of CSS classes that can be used for styling:

.container

The .container class provides the following properties:

  • display: flex
  • flex-wrap: wrap
  • box-sizing: border-box

.container.nowrap

The .container.nowrap class provides the following property:

  • flex-wrap: nowrap !important

.container.row

The .container.row class provides the following property:

  • flex-direction: row

.container.col

The .container.col class provides the following property:

  • flex-direction: column

.container.fstart

The .container.fstart class provides the following property:

  • align-items: flex-start

.container.align.center

The .container.align.center class provides the following property:

  • align-items: center

.container.justify.center

The .container.justify.center class provides the following property:

  • justify-content: center

.container.fillw, .fillw

The .container.fillw and .fillw classes provide the following property:

  • width: 100%

.container.fillh

The .container.fillh class provides the following property:

  • height: 100%

.container.sbetween

The .container.sbetween class provides the following properties:

  • justify-content: space-between !important
  • gap: 0

.container.fillwh

The .container.fillwh class provides the following properties:

  • width: 100%
  • height: 100%

.container.hugw

The .container.hugw class provides the following property:

  • width: fit-content

.container.hugh

The .container.hugh class provides the following property:

  • height: fit-content

.container .w50p

The .container .w50p class provides the following property:

  • width: 50%

.container.hughwh

The .container.hughwh class provides the following properties:

  • width: fit-content
  • height: fit-content

.container.fullscreen

The .container.fullscreen class provides the following properties:

  • width: 100%
  • min-height: 100vh

Padding

The following classes provide padding:

  • .p5 for padding: 5px;
  • .p10 for padding: 10px;
  • .p15 for padding: 15px;
  • .p20 for padding: 20px;
  • .p25 for padding: 25px;
  • .p30 for padding: 30px;
  • .p35 for padding: 35px;
  • .p40 for padding: 40px;
  • .p45 for padding: 45px;
  • .p50 for padding: 50px;
  • .p55 for padding: 55px;
  • .p60 for padding: 60px;
  • .p65 for padding: 65px;
  • .p70 for padding: 70px;
  • .p75 for padding: 75px;
  • .p80 for padding: 80px;
  • .p85 for padding: 85px;
  • .p90 for padding: 90px;
  • .p95 for padding: 95px;
  • .p100 for padding: 100px;