jump to navigation

Most used values of the ‘display’ property in CSS July 7, 2009

Posted by minals in CSS Hacks Tips and Tricks.
Tags: , , , , , ,
trackback

The display property defines how HTML elements should be displayed.

  • display: block

The element will generate a block around it with line break before and after the element.

 block

  • display: inline

The element will generate an inline box around it, which will be in line with rest of the content.

 inline 

  • display: inline-block

The element will generate a block box positioned as an inline box.

 inline-block

  • display : none

The element will not generate any box; the element will not be displayed at all.

  • display: inline-table

The element will generate a table like box positioned as an inline box.

 inline-table 

  • display: list-item

The element is displayed as a list item. The list is an unordered list and hence preceded by a bullet mark.IE5 on Mac displays the list as ordered.

 list-item 

  • display: run-in

The element will generate a block box if it is followed by any box other than block box. It will generate an inline box if followed by a fixed and absolutely positioned block box.

 run-in 

  • display: inherit

The element inherits its value from its parent element.

Comments»

No comments yet — be the first.