display flex 8 div in each row in css pleasealso margin-left 10 px

To display 8 divs in each row using flexbox in CSS, you can use the following code:

HTML:

<div class="container">
  <div class="item">1</div>
  <div class="item">2</div>
  <div class="item">3</div>
  <div class="item">4</div>
  <div class="item">5</div>
  <div class="item">6</div>
  <div class="item">7</div>
  <div class="item">8</div>
  <!-- Repeat the above divs for the desired number of rows -->
</div>

CSS:

.container {
  display: flex;
  flex-wrap: wrap;
}

.item {
  flex-basis: calc(12.5% - 10px); /* 12.5% to evenly distribute the divs in each row */
  margin: 10px;
}

In the above code, the container class represents the parent container, and the item class represents each individual div. We set the display property of the container to flex and use flex-wrap: wrap to wrap the divs to the next row when they exceed the container's width.

The flex-basis property is set to calc(12.5% - 10px) to calculate the width of each div. This allows 8 divs to evenly distribute in each row, and the margin property is set to 10px for the left and right margins of each div.

Adjust the flex-basis and margin values as per your requirements