display

Browser Internet Explorer Netscape Opera Safari Firefox
Version 5.5 6.0 7.0 8.0 8.0 9.0 7.0 8.0 9.2 9.5 1.3 2.0 3.1 1.5 2.0 3.0
Supported Part Part Part ? Part Part Part Part Yes Yes Yes Yes Yes Part Part Part

Short information
CSS CSS2
Default value inline
Inherited No
Applied To all elements
HTML analog No
Reference to specification http://www.w3.org/TR/CSS21/visuren.html#display-prop

Description
It is multi-purpose attribute which defines how the element should be shown in the document.

Syntax

display: block | inline | inline-table | list-item | none | run-in | table | table-caption | table-cell | table-column-group | table-footer-group | table-header-group | table-row | table-row-group

Arguments
The list of possible values of this attribute understood by different browsers is very short: block, inline, list-item and none. All other admissible arguments are supported by browsers selectively. In tab. 1 some popular browsers and their support of various properties are given.





Table 1. Browsers support of properties value «display».
Argument Description IE6 IE7 IE8 Op8 Op9.2 Ff1.5 Ff2 Ff3
block The element is shown as block. Application of this value for the integral elements (for example the tag <SPAN>) forces its messages like blocks. There is lines carry un the beginning and in the end of contents. Yes Yes Yes Yes Yes Yes Yes Yes
inline The element is displayed as integral. Block tags use (such as <DIV> and <P>) creates a carry automatically and shows contents of these tags on a new line . The argument inline cancels this feature, therefore contents of block elements begins with the place where the previous element has terminated. Yes Yes Yes Yes Yes Yes Yes Yes
inline-block This value generates a block element which is flowed round by other elements of web page like the integral element. Actually such element on the action is similar to integral elements (like the tag <IMG>). Thus its internal part is formatted as a block element. The element is built in. Yes Yes Yes Yes Yes No No Yes
inline-table It defines that the element is the table as in use of the tag <TABLE>, but thus the table is the built in element and there is its flow by other elements, for example, the text. No No ? Yes Yes No No Yes
list-item The element is deduced as block one and the list marker is added. Yes Yes Yes Yes Yes Yes Yes Yes
none It removes an element from a document temporarily. The place taken by it is not reserved. Also web page is formed so as if the element is absent. To change value of the parameter and to make it visible again it is possible with the help of scripts addressing to properties by an objective model. There is data reformatting on a page taking into account added element. Yes Yes Yes Yes Yes Yes Yes Yes
run-in It determines an element as block or integral one depending on a context. No No Yes Yes Yes No No No
table It defines the element is the block table like use of the tag <TABLE>. No No ? Yes Yes Yes Yes Yes
table-caption It specifies table heading like the tag <CAPTION> application. No No ? Yes Yes Yes Yes Yes
table-cell It specifies that the element is a table cell (tags <TD> or <TH>). No No ? Yes Yes Yes Yes Yes
table-column It specifies an element as a table column as if the tag <COL> has been added. No No ? No Yes Yes Yes Yes
table-column-group IIt defines that the element is group of one or more table columns as at use of the tag <COLGROUP>. No No ? No Yes Yes Yes Yes
table-footer-group It is used for storage of one or several cells lines which are displayed at the very table bottom. It is similar with work of the tag <TFOOT>. No No ? Yes Yes Yes Yes Yes
table-header-group The element is intended for storage of one or several cells lines which are at the table top. It is similar work of the tag <THEAD>. No No ? Yes Yes Yes Yes Yes
table-row An element is displayed at the top of a table (the tag <TR>) . No No ? Yes Yes Yes Yes Yes
table-row-group It creates the structural block consisting of several lines of the table as the tag <TBODY> action. No No ? Yes Yes Yes Yes Yes



Example

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
 <head>
  <meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
  <title>display</title>
  <style type="text/css">
   .example {
    border: dashed 1px #634f36; /* Frame parameters */
    background: #fffff5; /* Background color */
    font-family: "Courier New", Courier, monospace; /* Text font */
    padding: 7px; /* Areas around the text */
    margin: 0 0 1em; /* Indents around */
   }
   .exampleTitle {
    border: 1px solid black; /* Frame parameters */
    border-bottom: none; /* Remove the bottom line */
    padding: 3px; /* Areas around the text */
    display: inline; /* Set as biult-in element */
    background: #efecdf; /* Background color */
    font-weight: bold; /* Bold font */
    font-size: 90%; /* Text size */
    margin: 0; /* Remove indents around */
    white-space: nowrap; /* Cancel text hyphens */
   }
  </style>
 </head> 
 <body> 
 
  <p class="exampleTitle">Example</p>
  <p class="example">
  &lt;!DOCTYPE HTML PUBLIC &quot;-//W3C//DTD HTML 4.01 Transitional//EN&quot;&gt;<br>
  &lt;html&gt;<br>
  &lt;body&gt;<br>
  &lt;b&gt;Sulfuric acid formula:&lt;/b&gt;
  &lt;i&gt;H&lt;sub&gt;&lt;small&gt;2&lt;/small&gt;&lt;/sub&gt;
  SO&lt;sub&gt;&lt;small&gt;4&lt;/small&gt;
  &lt;/sub&gt;&lt;/i&gt;<br>
  &lt;/body&gt;<br>
  &lt;/html&gt;
  </p>
 
 </body>
</html>

The result of this example is shown on the figure 1


Object model

[window.]document.getElementById("elementID").style.display

Browsers
Internet Explorer before version 7 inclusively:
Supports of values "table-footer-group" and "table-header-group" is performed only for tags <THEAD> and <TFOOT>
Understands the value "block" as "list-item" for the elements <L1>
The value "inline-block" is used only for built-in elements.
Opera 9.2 and after, and alsoFirefox version 2.0 and before:
The value "table-column" is used only for the tag <COL>
The value "table-column-group" is used only for the tag <COLGROUP>