Bredd och höjd

Till blockelementens förinställda egenskaper hör bland annat att de är 100 % breda i förhållande till sitt föräldraelement. Höjden beror på hur mycket innehåll (text) elementet har.

Ange bredd och höjd

Med egenskaperna width och height bestämmer man hur stor plats en elementbox skall ta. Vill man ge exakta värden väljer man enheten px (pixlar), vilket motsvarar bildskärmens bildpunkter. Enheten % (procent) passar om man vill att elementet ska anpassa sig efter föräldraelementet.

Bredd och höjd är något som i första hand används till blockelement.

blockquote {width:500px; height:200px}

Bredd och höjd direkt

I vissa element använder man direkt CSS för att ange bredd och höjd. Detta är t.ex. nödvändigt i bildelement och andra objekt som inte ser lika ut över hela webbplatsen. Direkt bredd och höjd skrivs vid attributet style direkt i starttaggen enligt följande exempel:

<object style="width:300px; height:250px">

OBS! Var försiktig med att ange höjden på element vars innehåll kan komma att öka. Även de dynamiska enheterna kan ge problem i vissa webbläsare.

Överflödigt innehåll

En bestämd bredd och höjd på ett textblock ger också ett begränsat utrymme för texten. Text som inte får plats inom den angivna ytan hanteras olika beroende på webbläsaren.

Med olika värden till egenskapen overflow kan du själv beskriva vad du vill ska hända med det innehÃ¥ll som hamnar utanför ytan.

Värdet auto skapar rullningslister sÃ¥ att man kan rulla fram det som inte syns. Värdet hidden gör att det som ligger utanför blockets gränser blir bÃ¥de osynligt och otillgängligt för läsaren.

p.info {width:200px; height:100px; overflow:auto}