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

flipkart

Repulsive Raven answered on June 10, 2022 Popularity 10/10 Helpfulness 2/10

answer flipkart

related flipkart

flipkart

Comment

<ul class="container">
  <li class="flex flex1">1: flex-basis test</li>
  <li class="flex flex2">2: flex-basis test</li>
  <li class="flex flex3">3: flex-basis test</li>
  <li class="flex flex4">4: flex-basis test</li>
  <li class="flex flex5">5: flex-basis test</li>
</ul>

<ul class="container">
  <li class="flex flex6">6: flex-basis test</li>
</ul>

Popularity 10/10 Helpfulness 2/10 Language whatever

Source: developer.mozilla.org

Tags: whatever

Link to this answer
Share Copy Link

Contributed on Jun 10 2022

Repulsive Raven

0 Answers Avg Quality 2/10

Closely Related Answers

flipkart

Comment

.container {
  font-family: arial, sans-serif;
  margin: 0;
  padding: 0;
  list-style-type: none;
  display: flex;
  flex-wrap: wrap;
}

.flex {
  background: #6AB6D8;
  padding: 10px;
  margin-bottom: 50px;
  border: 3px solid #2E86BB;
  color: white;
  font-size: 14px;
  text-align: center;
  position: relative;
}

.flex:after {
  position: absolute;
  z-index: 1;
  left: 0;
  top: 100%;
  margin-top: 10px;
  width: 100%;
  color: #333;
  font-size: 12px;
}

.flex1 {
  flex-basis: auto;
}

.flex1:after {
  content: 'auto';
}

.flex2 {
  flex-basis: max-content;
}

.flex2:after {
  content: 'max-content';
}

.flex3 {
  flex-basis: min-content;
}

.flex3:after {
  content: 'min-content';
}

.flex4 {
  flex-basis: fit-content;
}

.flex4:after {
  content: 'fit-content';
}

.flex5 {
   flex-basis: content;
}

.flex5:after {
  content: 'content';
}

.flex6 {
  flex-basis: fill;
}

.flex6:after {
  content: 'fill';
}

Popularity 10/10 Helpfulness 1/10 Language whatever

Source: developer.mozilla.org

Tags: whatever whateve

Link to this answer
Share Copy Link

Contributed on Jun 10 2022

Repulsive Raven

0 Answers Avg Quality 2/10

flipkart

Contents

More Related Answers

flipkart

Closely Related Answers

flipkart

Grepper

Documentation

Social

Legal

Contact

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