Visibility

From Frontal Wiki

Purpose

This style sets the visibility of a visual element.

Value

Either "visible" or "hidden".

visibility: "hidden";

Remarks

The visibility style is part of a triumvirate of styles along with display and disable-rendering that control whether a visual element is in the Flash display list, the Frontal rendering list, neither or both.

When an element has display set to "none" then in it is removed from the Flash display list (and so not visible) and it is removed from the Frontal rendering list (and so its placement and dimensions do not have any effect on any other Frontal elements).

When an element has display set to "block" then the other two styles mentioned come into play independent of one another:

• Set visibility to "visible" to add the element to the Flash display list and set

it to "hidden" to remove it.

• Set disable-rendering to "false" to add the element to the Frontal rendering list and set

it to "true" to remove it.

Example

Note in this example how the div with visibility set to "hidden" cannot be seen but does affect the layout of the two surrounding div's.

<style><![CDATA[
    div
        {
			width: 30px;
			height: 30px;
			margin: 4px;
			float: left;
			background-color: red;
        }
]]></style>
<div />
<div style="visibility: hidden; background-color: black;" />
<div />

See Also

• display
• disable-rendering

Can Be Applied To

This style can be applied to any visual element:

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