Divider

Egnet til:

• å skape en tydelig oppdeling av innhold, for eksempel under en temaoverskrift.
• å strukturere innhold for bedre lesbarhet
• å lage ytterligere skille der luft ikke kraftig nok effekt. 

Uegnet til:

• å bruke der naturlig spacing eller andre visuelle elementer gir tilstrekkelig skille
• å brukes mange ganger nær hverandre, da det kan gi et rotete uttrykk. 

Teknisk dokumentasjon

Se Divider i Storybook for tekniske detaljer. 

Varianter

Divider finnes som nedtonet med 50 % gjennomsiktighet (standard), samt en uthevet variant uten gjennomsiktighet.

Hvordan bruke komponenten  

Unngå å bruke delelinjer utelukkende som en visuell effekt uten funksjonell betydning. Komponenten representerer et <hr>-element i HTML, som står for «horizontal rule» – HTML-elementet representerer et tematisk skille mellom avsnittsnivåelementer: for eksempel et skifte av tema.

Den skal brukes til å markere et skille mellom innhold som ikke hører logisk sammen, for eksempel ulike seksjoner i en artikkel eller ulike funksjonelle områder på en side. Bruk den for å tydeliggjøre strukturen, ikke bare for å fylle tomrom eller «pynte» siden.

Universell utforming  

• <hr>-elementet er semantisk og kan gi nyttig informasjon og struktur for skjermlesere.
• Bruk propen ariaHidden når streken kun er dekorativ, for eksempel for å ramme inn innhold eller skape luft, uten å markere et faktisk innholdsmessig skille.