Fixed Widget with Cascading Style Sheet

Xah Lee, 2005-01

To create something that is fixed to a position in the window, use the “position” attribute with value “fixed”. Like this:

<div style="position:fixed; right:1ex; bottom:1ex">
<p style="background-color:yellow">I Stick to the Corner no matter what.</p>
</div>

Here is a example. You'll see a yellow box fixed to the lower right corner of your window.

screen filler 1 
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+

screen filler 2 
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+

screen filler 3 
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+

screen filler 4 
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+