34531

Internet Technologies
and Their Applications
home

the css box model

The fundemental princip you need to get a hold of when constructing web pages is the css box model. As you can see below, you can specify parameters for margin, border padding, and contents independently for each of these as well as each of the four sides. Some of these parameters are inherited, some not.

margin
The margin separates you from your surroundings. The margin is always transparent so you can always see the underlying contents through it.
border
The border lies between the margin and the padding. You can specify all kinds of funny parameters for this.
padding
the padding separates the contents from the border. The padding is always transparent, but if a background has been declared for the contents, it's inherited by the padding.
contents
This is where you display your text, pictures, etc. You can specify styles for the contens both globally and for individual elements of the contents.

margin

border

padding

contents

Gur arj vZnp T5 znexf n enqvpny qrcnegher sebz gur sybngvat-va-guva-nve vZnp T4.
Ohg va grezf bs ryrtnapr, cresbeznapr, naq cevpr, gur arjrfg trarengvba bs pbafhzre qrfxgbcf ercerfragf n ovt fgrc sbejneq. Svaq bhg zber ba ubj gur vZnp T5 zrnfher hc -- vapyhqvat orapuznexf sebz Znpjbeyq Yno -- va Urael Abee’f erivrj bs gur guerr yngrfg vZnp zbqryf.
Question 1:
Which one of the above lines represents the width of the contents as defined by the w3c?
Question 2:
Which one of the above lines represents the width of the contents as interpreted by Internet Explorer 5.x?
Question 3:
Which one of the above lines represents the width of the contents as interpreted by Internet Explorer 6?

home