Positioning
An element can be displayed/hidden by using a property called visibility. This property can be used to hide error messages which are displayed to the user only when required. It can also be used to hide answers to an assessment until the user selects an option. The values which the property can take are: visible, hidden, collapse, initial, and inherit.
- Absolute : The element with this position is positioned at the mentioned coordinates relative to the screen’s top left corner.
- Relative: This positioning changes the element relative to where it normally appears.
- Fixed : Using this positioning, the elements can be fixed to a particular position irrespective of scrolling.
- Static : The elements are positioned static by default.
- Sticky : The elements are positioned based on the user’s scroll position.
Example:
<![CDATA[
<html>
<html lang="en-US">
<style>
div.static {
position: static;
border: 3px solid #73AD21;
}
</style>
</head>
<body>
<h2>Knowledge2life</h2>
<div class="static">
Online learning website
</div>
</body>
</html>]]>
OUTPUT:
Knowledge2life
Online learning website.
