Mer flexbox: Skillnad mellan sidversioner
PGJ (diskussion | bidrag) (Skapade sidan med '== Ordning == Vanligtvis placeras flexelement ut efter varandra, allt eftersom de är angivna i HTML-koden. Men om man vill lägga in innehållet i en annan ordning kan man an...') |
PGJ (diskussion | bidrag) Ingen redigeringssammanfattning |
||
| Rad 1: | Rad 1: | ||
== | = Avancerad styrning = | ||
Det finns ett antal CSS-egenskaper som kan användas för att styra flexboxars layout och flöde. | |||
== <code>flex-grow</code> | |||
Anger om flexboxarna ska kunna "växa till sig" och fylla upp tillgängligt utrymme. Som parameter tar denna egenskap en siffra som anger hur stor proportion av flex-utrymmet som elementet ska ta upp. Om alla element har detta värde satt till <code>1</code>, kommer de alla att bli lika stora. | |||
== <code>order</code> == | |||
Vanligtvis placeras flexelement ut efter varandra, allt eftersom de är angivna i HTML-koden. Men om man vill lägga in innehållet i en annan ordning kan man använda sig av <code>order</code>. Egenskapen tar ett heltal som parameter. De element som har lägst <code>order</code>-nummer kommer att placeras först. Lägg märke till att man kan ha flera element som har samma <code>order</coder>-nummer. De kommer då att placeras tillsammans som en grupp, är deras inbördes ordning bestäms av den ordning elementen angivits i HTML-koden. | Vanligtvis placeras flexelement ut efter varandra, allt eftersom de är angivna i HTML-koden. Men om man vill lägga in innehållet i en annan ordning kan man använda sig av <code>order</code>. Egenskapen tar ett heltal som parameter. De element som har lägst <code>order</code>-nummer kommer att placeras först. Lägg märke till att man kan ha flera element som har samma <code>order</coder>-nummer. De kommer då att placeras tillsammans som en grupp, är deras inbördes ordning bestäms av den ordning elementen angivits i HTML-koden. | ||
Versionen från 7 december 2014 kl. 23.22
Avancerad styrning
Det finns ett antal CSS-egenskaper som kan användas för att styra flexboxars layout och flöde.
== flex-grow
Anger om flexboxarna ska kunna "växa till sig" och fylla upp tillgängligt utrymme. Som parameter tar denna egenskap en siffra som anger hur stor proportion av flex-utrymmet som elementet ska ta upp. Om alla element har detta värde satt till 1, kommer de alla att bli lika stora.
order
Vanligtvis placeras flexelement ut efter varandra, allt eftersom de är angivna i HTML-koden. Men om man vill lägga in innehållet i en annan ordning kan man använda sig av order. Egenskapen tar ett heltal som parameter. De element som har lägst order-nummer kommer att placeras först. Lägg märke till att man kan ha flera element som har samma order</coder>-nummer. De kommer då att placeras tillsammans som en grupp, är deras inbördes ordning bestäms av den ordning elementen angivits i HTML-koden.