Top

From Frontal Wiki

Purpose

This style sets the position of the top edge of a visual element.

Value

A pixel value, a percentage value, a leftover percentage or "auto".

top: 100%;

Remarks

See the Frontal's Layout Scheme for a discussion on how the top style affects the layout of a visual element.

Example

This example shows a red 'div' element positioned at the top of the browser. It shows a blue 'div' element with a bottom edge at the bottom of the browser and a top edge at the top (thus stretching the 'div').

<style><![CDATA[
	#div1
		{
			width: 100px;
			height: 100px;
			background-color: red;
			top: 0px;
		}
	#div2
		{
			width: 100px;
			right: 100%;
			background-color: blue;
			top: 0px;
			bottom: 100%;
		}
]]></style>
<div id="div1" />
<div id="div2" />

Can Be Applied To

This style can be applied to any visual element:

• document
• div
• img
• text
• video
• form
• input