PROPERTY: display

display : block | compact | inline | inline-table | list-item | marker | none | run-in | table | table-caption | table-cell | table-column | table-column-group | table-footer-group | table-header-group | table-row | table-row-group
 
Compatibility:  IE4+  N4+
Most of the Level 2 additions are currently not supported by any browser
 
Version: Level 1/Expanded in Level 2
Inherited: No
 
The display property controls if or how an element will be displayed.
 
block Level 1
 
The block value is the default. It treats the element to be displayed as a block-level element, or block-level box, that has a line break before and after the element.
 
compact Level 2
 
The compact value assigns the element to be block-level or inline based upon the context.
 
inline Level 1
 
The inline value treats the element to be displayed as an inline element, or inline box, that does not have a line break before or after the element. In other words, everything is displayed on the same line.
 
inline-table Level 2
 
The inline-table value displays a table as an inline element, or inline box, that does not have a line break before or after the table.
 
list-item Level 1
 
The list-item value treats the element to be displayed as a list. Each item in the list can be preceded by an optional marker, such as the solid black circle,
  • associated with the HTML tag.< li >

  •  
    marker Level 2
     
    The marker value assigns the content, before or after a box element, to be a marker. It is used with the :after and :before pseudo-elements.
     
    none Level 1
     
    The none value prevents the display of the element.
     
    run-in Level 2
     
    The run-in value assigns the element to be block-level or inline based upon the context.
     
    table Level 2
     
    The table value displays the element as if it were a block-level table.
     
    table-caption Level 2
     
    The table-caption value displays the element as if it were a table caption.
     
    table-cell Level 2
     
    The table-cell value displays the element as if it were a table cell.
     
    table-column Level 2
     
    The table-column value displays the element as if it were a table column.
     
    table-column-group Level 2
     
    The table-column-group value displays the element as if it were a group of table columns.
     
    table-footer-group Level 2
     
    The table-footer-group value displays the element as if it were a group of table footers.
     
    table-header-group Level 2
     
    The table-header-group value displays the element as if it were a group of table headers.
     
    table-row Level 2
     
    The table-row value displays the element as if it were a table row.
     
    table-row-group Level 2
     
    The table-row-group value displays the element as if it were a group of table rows.
     
    Code:
    p { display: block; }
    img { display: inline; }
    li { display: list-item; }
    img { display: none; }

     
    or
     
    In this example, the second image is not displayed:
    Code:
    <img src="images/guru.gif" style="display: inline;">
    <img src="images/guru.gif" style="display: none;">
    <img src="images/guru.gif" style="display: inline;">

     
    Output:
     


    Copyright 1999-2001 by Infinite Software Solutions, Inc. All rights reserved.
    Trademark Information