Mens vi angir størrelsen på ethvert element i CSS , har vi to valg. Den første er absolutte enheter og den andre er relative enheter. Absolutte enheter er faste og ikke i forhold til noe annet. De er alltid identiske i alle fall. De involverer cm, mm, px osv. På den andre siden er relative enheter relative til noe annet. Det kan være størrelsen på det overordnede elementet eller størrelsen på hoved-HTML. Relative enheter dekker em, rem, vw, vh osv. Dette er skalerbare enheter og hjelper til med responsiv design. Mange av oss kan bli forvirret mellom de relative enhetene, spesielt i og rem enheter. La oss bryte ned forskjellen mellom disse to. I utgangspunktet at både rem og em er skalerbare og relative størrelsesenheter, men med em er enheten i forhold til skriftstørrelsen til det overordnede elementet, mens rem-enheten kun er i forhold til root-skriftstørrelsen til HTML-dokumentet. r in rem står for root.

La oss forstå dem begge i detalj.

1. i United: Em-enheten lar deg stille inn skriftstørrelsen til et element i forhold til skriftstørrelsen til det overordnede. Når størrelsen på det overordnede elementet endres, endres størrelsen på barnet automatisk.

Merk: Når em-enheter brukes på font-size-egenskapen, er størrelsen i forhold til font-størrelsen til overordnet. Når det brukes på andre egenskaper, er det i forhold til skriftstørrelsen til selve elementet. Her er det kun den første erklæringen som tar referansen til forelderen.

• Skriftstørrelsen til .child-elementet vil være 40 piksler (2*20 piksler).
• Marginen til .child vil være 60 piksler . Det er 1,5 ganger skriftstørrelsen til elementet vårt (1,5*40px).

Eksempel: Dette eksemplet viser bruken av em-enheten i CSS.

HTML