Breaking News: Grepper is joining You.com. Read the official announcement!

css colums like bootstrap

Hamel Raid answered on August 6, 2022 Popularity 3/10 Helpfulness 2/10

answer css colums like bootstrap

css colums like bootstrap

Comment

.grid {
  margin: 1em;
  border: solid lightgray;
  background: lightgray;
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  grid-gap: 2px;
  counter-reset: div;
}

.grid div {
  border: solid;
  text-align: center;
}

.grid div:before {
  counter-increment: div;
  content: 'N°' counter(div);
}

.grid div[class]:after {
  display: block;
  text-align: center;
  background: lightblue;
  content: "Class applied : "attr(class);
  color: crimson;
}


/* spanning cols, complete values missing */

.col-2 {
  grid-column: auto/span 2;
}

.col-3 {
  grid-column: auto/span 3;
}

.col-6 {
  grid-column: auto/span 6;
}

.col-8 {
  grid-column: auto/span 8;
}


/* spanning rows , complete values missing*/

.row-2 {
  grid-row: auto/span 2;
}

Popularity 3/10 Helpfulness 2/10 Language css

Source: stackoverflow.com

Tags: css

Link to this answer
Share Copy Link