Web Hosting by Netfirms | Free Domain Names by Netfirms

css_week5

1. Use relative and absolute positioning to place two elements on your HTML page.

Position uses left and top. An inline position rule looks like this:

Relative position rule the relative position is -10px; left:01px;

Looks like this measured as 40px from left margin.

Looks like this measured as 80px from left margin, This relative position essentially
indents the block identified with a paragraph tag.
and I understand that the spanned element could
be a word within an H2 or P tag set.
It could be an IMG or P within the BODY tag set. It could be an image in a table cell.

An image with imbedded .para {position: relative; left:200px;}

2. Use z-index to stack some images: With the image at bottom of stack z-index:1 and image below z-index:2
Three images using top from 90px,60px, and 30px and left from 80px, 60px, and 40px

3. Add an overflow element to one of your HTML pages. Included indentation with <P style="position: relative; left:40x> appended to <P style width:200px; height:100px; overflow:scroll;"> for overflow:scroll:

The Position Property Position places elements on the page. It has three possible values: relative Places the element relative to its expected position in the normal flow of the page. The space the element would have occupied remains blank. absolute Places the element relative to the browser window or to the containing (parent) element. The element does not fall in to the normal flow of the document. The space the element would have occupied closes up. static Static is the default position for the position property. Static elements cannot be positioned or repositioned. They cannot serve as the marker for an absolutely positioned element

Created on ... November 11, 2002