Absolute Positioning

Archives by Tag 'viewport'

The box model

At the top level the web page is a canvas—a container for other elements that have to be placed in it. It can be seen as a box, which has a specific dimension—x and y coordinate and a z-axis that flows away from the viewer into 3D space. Each element that is placed into the [...]

Defining concepts

Absolute positioning defines the x and y coordinates of an element with reference to the top-left corner of the browser page or the containing block, and the position attribute is set to absolute. The code will read somewhat like this: <style type= “text/css”> <!-– p {position: absolute; left 50pt; top: 30pt} –> </style> Note that [...]

Absolute positioning in CSS

Absolute positioning is one of the more powerful features of CSS and can be used to an advantage by an experienced web designer. Absolute positioning is specified by giving values for the top, bottom, left, and right properties. These properties will specify the distance from corresponding edge of the page or its parent element. This [...]

Understanding the need for visual formatting model

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 [...]

Imitating frames with absolute positioning

The <?xml version =1.0” encoding….> in the Quirks mode, will take care of the versions of IE and its problems with display as already indicated in an earlier chapter. The div elements will come to our aid in place of the framesets. All the div tags will be absolutely positioned, and their overflow property will [...]

Positioning elements within frames absolutely

Frames load separate pages. Each page is an independent container for different elements. These elements can be positioned using CSS-positioning techniques without reference to the positioning of elements in the other pages being loaded on different frames of the web page concurrently. Each page loaded onto a frame acts like an independent viewport. The elements [...]