Compare Revisions

visibility

Change Revisions

Revision 24587:

Revision 24587 by McGurk on

Revision 24588:

Revision 24588 by teoli on

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

Revision 24587
Revision 24588
nn4 
5    <style type="text/css">
6![CDATA[.cssprop {
7    display:table;
8    padding: 0.4em;
9    border-left:0.15em solid;
10    background-color:#eeeeff
11    }
12    .cssprop li {
13    display:table-row;
14    padding: 3px;
15    margin:0;
16    }
17    .cssprop li dfn {
18    display:table-cell;
19    padding: 0 5px;
20    border-bottom: none;
21    cursor:inherit;
22    }
23 
24    ]]>
25    </style>
n10    <h3>n32    <h2 id="Summary">
n12    </h3>n34    </h2>
n22    <ul>n44    <ul class="cssprop">
23      <li>{{ Xref_cssinitial() }}: {{ Cssxref("visible") }}
24      </li>45      <li>
25      <li>Applies to: All elements46        <nobr><dfn>{{ Xref_cssinitial() }}:</dfn> {{ Cssxref("vis
 >ible") }}</nobr>
47      </li>
26      </li>48      <li>
27      <li>{{ Xref_cssinherited() }}: Yes49        <nobr><dfn>Applies to:</dfn> All elements</nobr>
50      </li>
28      </li>51      <li>
29      <li>Media: {{ Xref_cssvisual() }}52        <nobr><dfn>{{ Xref_cssinherited() }}:</dfn> Yes</nobr>
53      </li>
30      </li>54      <li>
55        <nobr><dfn>Media:</dfn> {{ Xref_cssvisual() }}</nobr>
56      </li>
57      <li>
31      <li>{{ Xref_csscomputed() }}: As specified58        <nobr><dfn>{{ Xref_csscomputed() }}:</dfn> As specified</
 >nobr>
n34    <h3>n61    <h2 id="Syntax">
35      Syntax62      <nobr>Syntax</nobr>
36    </h3>63    </h2>
n38visibility:  visible | hidden | collapse | {{ Cssxref("inherit") n65<nobr>visibility:  visible | hidden | collapse | {{ Cssxref("inhe
>}}>rit") }}
66</nobr>
n40    <h3>n68    <h3 id="Values">
41      Values69      <nobr>Values</nobr>
n45        visiblen73        <nobr>visible</nobr>
n48        Default value, the box is visible.n76        <nobr>Default value, the box is visible.</nobr>
n51        hiddenn79        <nobr>hidden</nobr>
n54        The box is invisible (fully transparent, nothing is drawnn82        <nobr>The box is invisible (fully transparent, nothing is
>), but still affects layout.&nbsp; Descendants of the element wil> drawn), but still affects layout.&nbsp; Descendants of the eleme
>l be visible if they have <code>visibility:visible</code> (this d>nt will be visible if they have <code>visibility:visible</code> (
>oesn't work in IE up to version 7).>this doesn't work in IE up to version 7).</nobr>
n57        collapsen85        <nobr>collapse</nobr>
n60        For table rows, columns, column groups, and row groups thn88        <nobr>For table rows, columns, column groups, and row gro
>e row(s) or column(s) are hidden and the space they would have oc>ups the row(s) or column(s) are hidden and the space they would h
>cupied is (as if <code>{{ Cssxref("display") }}: none</code> were>ave occupied is (as if <code>{{ Cssxref("display") }}: none</code
> applied to the column/row of the table). However, the size of ot>> were applied to the column/row of the table). However, the size
>her rows and columns is still calculated as though the cells in t> of other rows and columns is still calculated as though the cell
>he collapsed row(s) or column(s) are present. This was designed f>s in the collapsed row(s) or column(s) are present. This was desi
>or fast removal of a row/column from a table without having to re>gned for fast removal of a row/column from a table without having
>calculate widths and heights for every portion of the table. For > to recalculate widths and heights for every portion of the table
>XUL&nbsp;elements, the computed size of the element is always zer>. For XUL&nbsp;elements, the computed size of the element is alwa
>o, regardless of other styles that would normally affect the size>ys zero, regardless of other styles that would normally affect th
>, although margins still take effect. For other elements, <code>c>e size, although margins still take effect. For other elements, <
>ollapse</code> is treated the same as <code>hidden</code>.>code>collapse</code> is treated the same as <code>hidden</code>.<
 >/nobr>
n63    <h3>n91    <h3 id="Examples">
64      Examples92      <nobr>Examples</nobr>
n67p        { visibility: hidden; }    /* paragraphs won't be visibln95<nobr>p        { visibility: hidden; }    /* paragraphs won't be 
>e */>visible */
nn98</nobr>
n71    <h3>n100    <h2 id="Notes">
72      Notes101      <nobr>Notes</nobr>
73    </h3>102    </h2>
n75      The support for <code>visibility:collapse</code> is missingn104      <nobr>The support for <code>visibility:collapse</code> is m
> or partially incorrect in some modern browsers. In many cases it>issing or partially incorrect in some modern browsers. In many ca
> may not be correctly treated like <code>visibility:hidden</code>>ses it may not be correctly treated like <code>visibility:hidden<
> on elements other than table rows and columns.>/code> on elements other than table rows and columns.</nobr>
76    </p>
77    <p>105    </p>
106    <p>
78      <code>visibility:collapse</code> may change the layout of a107      <nobr><code>visibility:collapse</code> may change the layou
> table if the table has nested tables within the cells that are c>t of a table if the table has nested tables within the cells that
>ollapsed, unless <code>visibility:visible</code> is specified exp> are collapsed, unless <code>visibility:visible</code> is specifi
>licitly on nested tables.>ed explicitly on nested tables.</nobr>
nn109    <h2 id="Browser_compatibility">
110      <nobr>Browser compatibility</nobr>
80    <h2>111    </h2>
81      Browser compatibility
82    </h2>112    <p>
83    <p>
84      {{ CompatibilityTable() }}113      <nobr>{{ CompatibilityTable() }}</nobr>
n184    <h3>n213    <h2 id="Specifications">
185      Specifications214      <nobr>Specifications</nobr>
186    </h3>215    </h2>
n189        <a class="external" href="http://www.w3.org/TR/CSS21/visun218        <nobr><a class="external" href="http://www.w3.org/TR/CSS2
>fx.html#visibility">CSS 2.1 Visual effects #visibility</a>>1/visufx.html#visibility">CSS 2.1 Visual effects #visibility</a><
 >/nobr>
t192    <h3>t221    <h2 id="See_also">
193      See also222      <nobr>See also</nobr>
194    </h3>223    </h2>
195    <p>
196      {{ Cssxref("display") }}
197    </p>224    <p>
225      <nobr>{{ Cssxref("display") }}</nobr>
198    <p>226    </p>
227    <p>
199      {{ languages( { "de": "de/CSS/visibility", "fr": "fr/CSS/vi228      <nobr>{{ languages( { "de": "de/CSS/visibility", "fr": "fr/
>sibility", "pl": "pl/Dokumentacja_CSS/W\u0142asno\u015bci_szablon>CSS/visibility", "pl": "pl/Dokumentacja_CSS/W\u0142asno\u015bci_s
>u", "zh-cn": "cn/CSS/visibility" } ) }}>zablonu", "zh-cn": "cn/CSS/visibility" } ) }}</nobr>

Back to History