html - 如何让这个div居中对齐？

Question

<分区>

Answer 1

使用justify-content: center到.course-flex-row-2

.course-flex-container {
  display: flex;
  flex-direction: column;
  margin: 5px 5px 5px 5px;
  background-color: red;
}

.course-flex-row {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}

.course-flex-row-2 {
  display: flex;
  flex-direction: row;
  justify-content: center;
}

<div class="course-flex-container">
  <div class="course-flex-row">
    <div>edit</div>
    <div>delete</div>
  </div>
  <div class="course-flex-row-2">
    <div>Read Chapter 1 to 3</div>
  </div>
  <div class="course-flex-row">
    <div>Blaw 3100</div>
    <div>Due Date: 6/29/2017</div>
  </div>
</div>