Align-items: Skillnad mellan sidversioner
Från Webbling
PGJ (diskussion | bidrag) (Skapade sidan med 'Justerar en flexboxs innehåll längsmed korsaxeln. Se denna Mer_flexbox#align-items sektion för mer utförlig information. == Egenskaper == {| class="wikitable" | Parame...') |
PGJ (diskussion | bidrag) |
||
| (9 mellanliggande sidversioner av samma användare visas inte) | |||
| Rad 1: | Rad 1: | ||
Justerar en | Justerar hur en flexbehållares innehåll placeras ut längs med korsaxeln. Se denna [[Mer_flexbox#align-items|sektion]] för mer utförlig information. | ||
== Egenskaper == | == Egenskaper == | ||
{| class="wikitable" | {| class="wikitable" | ||
| Rad 18: | Rad 18: | ||
|} | |} | ||
<code>flex-start</code> | <code>flex-start</code> flexinnehållets toppkant flyttas mot korsaxelns start. | ||
<code>flex-end</code> | <code>flex-end</code> flexinnehållets bottenkant flyttas mot korsaxelns slut. | ||
<code>center</code> | <code>center</code> flexinnehållet center justeras mellan korsaxelns start och slut. | ||
<code>baseline</code> | <code>baseline</code> allt flexinnehålls justeras så att deras baslinjer sammanfaller. | ||
<code>stretch</code> flexinnehållet sträcks ut längs hela korsaxeln. | |||
== Exempel == | == Exempel == | ||
<codepen pen="zGVNvq" height="700" tab="css,result"> | |||
<codepen pen="zGVNvq" height=" | |||
</codepen> | </codepen> | ||
== Egenskapens definition == | == Egenskapens definition == | ||
http://dev.w3.org/csswg/css3-flexbox/#align-items | http://dev.w3.org/csswg/css3-flexbox/#align-items | ||
Nuvarande version från 12 januari 2019 kl. 23.25
Justerar hur en flexbehållares innehåll placeras ut längs med korsaxeln. Se denna sektion för mer utförlig information.
Egenskaper
| Parametrar | flex-start | flex-end | center | baseline | stretch
|
| Defaultvärde | stretch
|
| Ärvs? | Nej |
| Animerbart? | Nej |
| Fungerar med... | Flexbehållare |
flex-start flexinnehållets toppkant flyttas mot korsaxelns start.
flex-end flexinnehållets bottenkant flyttas mot korsaxelns slut.
center flexinnehållet center justeras mellan korsaxelns start och slut.
baseline allt flexinnehålls justeras så att deras baslinjer sammanfaller.
stretch flexinnehållet sträcks ut längs hela korsaxeln.