I en värld där man kan surfa på allt ifrån sina mobiltelefoner till gigantiska tv-apparater med 4k-upplösning är det klokt att skapa hemsidor som anpassar sig till besökarens skärm. Ett enkelt sätt är att använda enheterna vh (viewport-height) och vw (viewport-width) när du sätter höjd, bredd, marginaler och typsnittsstorlek på din sida (läs mer här: https://www.w3schools.com/CSSref/css_units.asp). I denna uppgift får du också prova CSS:s egen beräkningsfunktion calc() (läs mer på https://www.w3schools.com/cssref/func_calc.asp). Med denna kan du exempelvis addera, subtrahera, multiplicera och dividera dina värden. Lycka till!
/* Ta bort alla marginaler och all utfyllnad på alla element */ * {} /* Textstorleken ska räknas ut genom att 0.6em adderas med 1% av skärmens bredd. Radhöjden ska vara 1.6 Typsnittsfamiljen ska vara sans-serif */ html {} /* Bakgrundsbilden ska vara old_man.jpg. Bakgrundspositionen ska vara centrerad och bakgrundsstorleken ska täcka hela elementet. Utfyllnaden ska vara 10% av skärmens bredd. Höjden på elementet ska räknas ut genom att ta halva skärmens höjd och subtrahera 20% av skärmens bredd Textfärgen ska vara vit */ header {} /* Textfärgen ska vara #266c98 */ h2 {} /* Utfyllnaden ska vara 10% av skärmens bredd. */ section {} /* Marginalen ska vara 1em uppåt och nedåt men 0 åt vänster och höger */ p {} /* Bildens bredd ska vara 100% av p-elementets bredd. */ img {}