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

flexbox css 3 columns default layout

Add Answer

Angela Fox answered on June 24, 2021 Popularity 7/10 Helpfulness 6/10

answer flexbox css 3 columns default layout

related flexbox 3 columns

related css flexbox default 5 columns layout

flexbox css 3 columns default layout

Comment

.container {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-around;
  padding: 10px;
}

.box {
  flex: 0 30%; /*lower the % to get more columns*/
  flex-grow: 1;
  background-color: orange; /*change the color (just orange to show outline)*/
  height: 500px;
  width: 300px;
  margin: 10px;
  border: 2px solid black;
}

Popularity 7/10 Helpfulness 6/10 Language css

Source: Grepper

Tags: css default flexbox layout

Link to this answer
Share Copy Link

Contributed on Jan 30 2023

Angela Fox

0 Answers Avg Quality 2/10

Closely Related Answers

flexbox 3 columns

Comment

.parent {
  display: flex;
}

.children {
  flex-basis: calc(100%/3);
}

Popularity 10/10 Helpfulness 10/10 Language css

Source: Grepper

Tags: css

Link to this answer
Share Copy Link

Contributed on Jun 24 2021

Rudolph Steyn

0 Answers Avg Quality 2/10

css flexbox default 5 columns layout

Comment

.container {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-around;
  padding: 10px;
}

.box {
  flex: 0 17%;
  flex-grow: 1;
  background-color: orange;
  height: 500px;
  width: 300px;
  margin: 10px;
  border: 2px solid black;
}

Popularity 1/10 Helpfulness 1/10 Language css

Source: Grepper

Tags: css default flexbox layout

Link to this answer
Share Copy Link

Contributed on Jan 30 2023

Angela Fox

0 Answers Avg Quality 2/10

flexbox css 3 columns default layout

Contents

More Related Answers

flexbox css 3 columns default layout

Closely Related Answers

flexbox 3 columns

css flexbox default 5 columns layout

Grepper

Documentation

Social

Legal

Contact

Oops, You will need to install Grepper and log-in to perform this action.