mozilla

Compare Revisions

position

Change Revisions

Revision 25402:

Revision 25402 by mmclark on

Revision 25403:

Revision 25403 by mmclark on

Title:
position
position
Slug:
CSS/position
CSS/position
Tags:
css, "CSS Reference"
css, "CSS Reference"
Content:

Revision 25402
Revision 25403
tt108    </p>
109    <h4>
110      Fixed positioning
111    </h4>
112    <p>
113      Fixed positioning is similar to absolute positioning, with 
 >the exception that the element's containing block is the viewport
 >.&nbsp; This is often used to create a floating element that stay
 >s in the same position even after scrolling the page.&nbsp; In th
 >e example below the "One" box is fixed 80px from the top of the p
 >age and 20px from the left:
114    </p>
115    <pre>
116#one { position: fixed; top: 80px; left: 20px }
117</pre>
118    <p>
119      When viewing the top of the page, the position box appears 
 >in the upper left, and after scrolling, it remains in the same pl
 >ace relative to the viewport:
120    </p>
121    <p>
122      <a href="/@api/deki/files/4924/=fixed-1.png" title="fixed-1
 >.png"><img align="left" alt="fixed-1.png" class="internal lwrap" 
 >src="/@api/deki/files/4924/=fixed-1.png?size=thumb" style="width:
 > 160px; height: 125px;"></a>
123    </p>
124    <p>
125      <a href="/@api/deki/files/4925/=fixed-2.png" title="fixed-2
 >.png"><img align="left" alt="fixed-2.png" class="internal lwrap" 
 >src="/@api/deki/files/4925/=fixed-2.png?size=thumb" style="width:
 > 160px; height: 100px;"></a>
126    </p>
127    <p>
128      &nbsp;
129    </p>
130    <p>
131      &nbsp;
132    </p>
133    <p>
134      &nbsp;
135    </p>
136    <p>
137      &nbsp;
138    </p>
139    <p>
140      &nbsp;

Back to History