CSS Display
There are times when it is required to change the display property of some elements.
For instance, to create a simple navigation links, the easiest way is to change the display property of list elements to show the list in the same line instead of one per each line.
The CSS display property's values and description is provided in the below table.
Value | Description |
Inline | As the name implies, the inline property makes the element to follow the flow of a line. |
Block | It makes the HTML element to be a stand alone element, it is helpful to manipulate height and width of a specific element effectively. |
None | It makes the element to disappear, the code will be there but the element won't be displayed. |
Example
CSS Display Example
<ul> <li><a href="" target="_parent">Home</li> <li><a href="" target="_parent">About Us</li> <li><a href="" target="_parent">Contact Us</li> </ul>
Preview
CSS Display property applied to the above unordered list is given below.
<style> li { display:inline; } </style>