02_size_css.html

By default, images are displayed at their full resolution and size. They can be resized using CSS, for example, this page uses a CSS rule that styles all elements that use the IMG tag.

Experiment

• Notice that the img element contains no styling instructions.
• What happens when both width and height CSS properties are used simultaneously? Does this image look 'right'?
• What happens if a second image is added to the page? Are both images formatted the same?
• What happens if the font-size in the body rule is chanegd to 2em, 3em or larger?
• What alternative sizing units are there?
  • What about %, em or vmin?
  • Try 15em and 100vw
  • When img width is not defined using ems what happens to the image if you change the size of the font-size in the body rule?