右侧 div 宽度受限

Question

可用页面宽度为 1600 像素，我试图将 div 右对齐，最大宽度为 1200 像素。但这并没有发生。

.csystem {
  display: flex;
  max-width: 1200px;
  flex-direction: column;
  justify-content: flex-end
}

<div class="csystem">
  <h1>Yes</h1>
  <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit...</p>
</div>

Answer 1

试试这个：

.csystem{
    float: right;
   max-width: 1200px;
}

Answer 2

您应该使用 align-items 而不是 justify-content 因为您将 flex-direction 更改为列

.csystem {
  display: flex;
  max-width: 1200px;
  /* margin-left: auto; */ /* If you wnat the div to be on the right */
  flex-direction: column;
  align-items: flex-end;
}

<div class="csystem">
  <h1>Yes</h1>
  <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit...</p>
</div>

右侧 div 宽度受限

A div in right with restricted width

html

css

right-align

flexbox