HTML elements can be displayed either in block or inline style.
The difference between these is one of the most basic things you need to know in order to use CSS effectively.
The 3 ways that HTML elements can be displayed
All HTML elements are naturally displayed in one of the following ways:
Block
Takes up the full width available, with a new line before and after (display:block;)
Inline
Takes up only as much width as it needs, and does not force new lines (display:inline;)
Not displayed
Some tags, like <meta /> and <style> are not visible (display:none;)
Block example
<p> tags and <div> tags are naturally displayed block-style.
(I say "naturally" because you can override the display style by setting the CSS display property e.g. display:inline;.)
A block-display element will span the full width of the space available to it, and so will start on a new line in the flow of HTML. The flow will continue on a new line after the block-display element.
Here I’ve started a paragraph and now I’m going to insert a <div>
Read More at : http://www.webdesignfromscratch.com/html-css/css-block-and-inline/
