[ANSWERED] html – How do I align items in a

Question 1

try to use justify-content:space-between instead of align-item:flex-end

Question 2

You can use the text-align CSS property, instead of flex:

details {
   text-align: right;
}

Question 3

Do you want this?

details {
  display: flex;
  flex-direction: column;
}
summary ~ div {
  text-align:right;
}}

<details>
  <summary>example</summary>

  <div>aaa</div>
  <div>aaa</div>
  <div>aaa</div>
  <div>aaa</div>
</details>

Question 4

I want to have a details that has a width of 100% and that aligns it’s items to the right.

I have tried:

details {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
}

HTML:

<details>
  <summary>example</summary>

  <div>aaa</div>
  <div>aaa</div>
  <div>aaa</div>
  <div>aaa</div>
</details>

The problem is, that the items are 100% wide and don’t get aligned to the right.

Bollate