Information om denne video
Underviser: Thomas Iversen, A-kasse priser
I denne video skal vi arbejde med det man kalder for "boksmodellen" i CSS. Boksmodellen er et udtryk for, hvordan alle HTML-elementer er opbygget som kasser, og hvordan du så kan anvende padding, border og margin til at positionere indholdet i disse kasser i forhold til hinanden på siden.
Øvelser:
1 - Lav en div som har et billede som indhold, og som derudover har 20px padding, 5px border og 20px margin både i top og bund, men ikke til højre og venstre. Anvend baggrundsfarver både på din side og på din div, så du visuelt kan se både padding, border og margin.
2 - Lav to divs (div1 og div2), som er nested inde i hinanden. div2 skal have dimensionerne 500px gange 500px. Style den inderste div1 med margin 10% og fyld lidt tekstindhold i. Observer og forstå hvad der sker når du ændre i indholdet i div1 eller gør div2 større.
Video tags: