> -----Message d'origine-----
> De : Tab Atkins Jr. [mailto:jackalmage@gmail.com]
> Envoyé : mercredi 8 avril 2015 22:50
> À : Matt Hughes
> Cc : www-style list
> Objet : Re: [css-flexbox] justify-self
>
> On Fri, Apr 3, 2015 at 3:00 PM, Matt Hughes < <mailto:hughes.matt@gmail.com> hughes.matt@gmail.com>
> wrote:
> > Flexbox defines the following properties:
> >
> > justify-content - main-axis parent
> > align-items - cross-axis parent
> > align-self - cross-axis self
> >
> > Why is there no justify-self for aligning a single flexbox child along
> > the main-axis?
>
> Because there can be multiple children in that axis. The *-self properties
> only work if the child is all alone in that axis.
>
> When there are multiple boxes
> to be aligned, they can only be aligned en masse, with the *-content
> properties.
Just to to play devil's advocate, we could actually have a two-steps justification algorithm allowing exactly that:
.line {
justify-content: distribute-space-between;
}
.item1 {
justify-self: end;
}
.item2 {
justify-self: center;
}
.item3 {
justify-self: start;
}
<line>
<.item1/><.item2/><.item3/>
</line>
The justify-content attributes the space to items, and by default they have a default alignment that matches (first get start, last get end, others center) but could be overridden. In that case, spaces between two boxes is divided into two equal parts and each box is justified in its space box.
Whether it makes sense is another question. Maybe it does for things that only take one or two boxes, for instance, and you want the boxes to decide where to stay.
