Block Boxes

I normalt dokument flow vil boksene stakke sig ovenpå hinanden i rækkenfølge. Fra øverste venstre hjørne fra top til bund. Astanden mellem box-elementerne er bestemt af margins. Og top og bund margin vil lægge sig ind over hinanden.

ekssempler på blocklevel elementer er <h1>, <p>, <ul>, <table> o.g det som kendetegner den er at der er et linieskift efter slut-tagget.

Man kan definere en generisk box ved hjælp at <div> tagget. Dette tag er blevet brugt i vid udstrækning til at opdele websider i felter – for at styre et layout. Der er dog nogle nye block-level elemter i html5 som er mere beskrivende for indholdet: <header>, <nav>, <section>, <article> og <footer> er tags man har valgt til at gøre sider mere semantiske(beskrivende).

Størrelsen på box-elementer kan styre ved at angive width, height i pixels, em eller % af browservinduet. Hvis man ikke angiver en størrelse vil indholdet af boxen fx tekst – være bestemmende.

Inline Boxes

Inline boxes vises horisontalt efter hinanden – inline elemnterne vil automatisk springe ned på en ny linie når der ikke er mere plads i den box de er i.  Tekst er inline elemter og billeder er også inline. A tagget er ligeledes et inline element. <b>, <i>, <em> er andre eksempler. Det generiske tag for inline elementer er <span> tagget.