Archives by Tag 'block elements'

HTML frustrations

By Steve Monas - Last updated: Tuesday, June 15, 2010

Frustration is the genesis of innovation in web design. The language of the web started out as simple HTML. It is an acronym for hypertext markup language. Tim Berners-Lee used that language in his CERN. He had a very limited requirement. He wanted a technology and a program that would help him interpret HTML and [...]

Types of positioning

By Steve Monas - Last updated: Monday, June 14, 2010

While this default “flow” does not give the designer much scope for manipulating layouts, CSS allows the designer to apply a small set of attributes to the elements of the page and control their position by defining coordinates within which they will appear. CSS 1 provided the user with the ability to specify: The width [...]

Static positioning

By Steve Monas - Last updated: Monday, June 14, 2010

Static positioning is the default positioning of elements on the page. It sources the element as in the HTML and places them linearly one after another. The elements cannot be repositioned and do not have defined coordinates for the element’s position. However, the <body> element is positioned and provides the coordinates for the child elements [...]

Understanding the need for visual formatting model

By Steve Monas - Last updated: Monday, June 14, 2010

CSS visual formatting model supposes that a document contains a number of boxes within boxes. A box can have a border and a background. The content of the box will be held in the center of the box and the area around it will be the padding. The margin is around the border of the [...]

Example of an absolutely positioned vertical menu construction

By Steve Monas - Last updated: Sunday, June 13, 2010

Begin by defining the menu div as below: #menu {width: 12em; background: #eee} The use of em tags will take care of the width of the menu to the container div. This also resolves IE’s box-model problems. All the block elements inside this div will fill the containers width by default. The em widths will [...]

Graphics, images, video, and audio

By Steve Monas - Last updated: Sunday, June 13, 2010

The originators of the web would never recognize their creation, as it exists today. A profusion of graphics, images, audio, and video are used for a multitude of purposes. Images and graphics can replace text for communication or they can themselves act as elements for navigation. Audio and video can be used to reach out [...]