<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>Saffron Stroke - Your Web Design Resource &#187; inline-block</title>
	<atom:link href="http://www.saffronstroke.com/tag/inline-block/feed/" rel="self" type="application/rss+xml" />
	<link>http://www.saffronstroke.com</link>
	<description>Design Blog</description>
	<lastBuildDate>Wed, 11 Jan 2012 06:36:24 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.0</generator>
		<item>
		<title>Most used values of the &#039;display&#039; property in CSS</title>
		<link>http://www.saffronstroke.com/2009/07/07/most-used-values-of-the-display-property-in-css/</link>
		<comments>http://www.saffronstroke.com/2009/07/07/most-used-values-of-the-display-property-in-css/#comments</comments>
		<pubDate>Tue, 07 Jul 2009 07:21:56 +0000</pubDate>
		<dc:creator>Minal</dc:creator>
				<category><![CDATA[CSS Hacks, Tips and Tricks]]></category>
		<category><![CDATA[block]]></category>
		<category><![CDATA[css]]></category>
		<category><![CDATA[display property]]></category>
		<category><![CDATA[display: inline-block; inline]]></category>
		<category><![CDATA[HTML]]></category>
		<category><![CDATA[HTML property]]></category>
		<category><![CDATA[inline-block]]></category>

		<guid isPermaLink="false">http://saffronstroke.com/?p=581</guid>
		<description><![CDATA[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.   display: inline The element will generate an inline box around it, which will be in line with rest of the content.    display: inline-block The element [...]]]></description>
			<content:encoded><![CDATA[<div align="left" style="float: none; clear:right; padding: 0px 5px 5px 0px;"><a name="fb_share" type="button_count" share_url="http://www.saffronstroke.com/2009/07/07/most-used-values-of-the-display-property-in-css/"></a></div><div class="tweetmeme_button" style="float: right; margin-left: 10px;; margin-top:-2px;">
			<a href="http://api.tweetmeme.com/share?url=http%3A%2F%2Fwww.saffronstroke.com%2F2009%2F07%2F07%2Fmost-used-values-of-the-display-property-in-css%2F"><br />
				<img src="http://api.tweetmeme.com/imagebutton.gif?url=http%3A%2F%2Fwww.saffronstroke.com%2F2009%2F07%2F07%2Fmost-used-values-of-the-display-property-in-css%2F&amp;style=normal" height="61" width="50" /><br />
			</a>
		</div>
<p>The display property defines how HTML elements should be displayed.</p>
<ul>
<li>display: block</li>
</ul>
<p style="padding-left:30px;">The element will generate a block around it with line break before and after the element.</p>
<p style="padding-left:30px;"> <img title="block" src="http://www.saffronstroke.com/wp-content/uploads/2009/07/block.jpg" alt="block" width="262" height="114" /></p>
<ul>
<li>display: inline</li>
</ul>
<p style="padding-left:30px;">The element will generate an inline box around it, which will be in line with rest of the content.</p>
<p style="padding-left:30px;"> <img class="alignnone size-full wp-image-585" title="inline" src="http://www.saffronstroke.com/wp-content/uploads/2009/07/inline.jpg" alt="inline" width="261" height="112" /> </p>
<ul>
<li>display: inline-block</li>
</ul>
<p style="padding-left:30px;">The element will generate a block box positioned as an inline box.</p>
<p style="padding-left:30px;"> <img class="alignnone size-full wp-image-586" title="inline-block" src="http://www.saffronstroke.com/wp-content/uploads/2009/07/inline-block.jpg" alt="inline-block" width="262" height="112" /></p>
<ul>
<li>display : none</li>
</ul>
<p style="padding-left:30px;">The element will not generate any box; the element will not be displayed at all.</p>
<ul>
<li>display: inline-table</li>
</ul>
<p style="padding-left:30px;">The element will generate a table like box positioned as an inline box.</p>
<p style="padding-left:30px;"> <img class="alignnone size-full wp-image-587" title="inline-table" src="http://www.saffronstroke.com/wp-content/uploads/2009/07/inline-table.jpg" alt="inline-table" width="262" height="113" /> </p>
<ul>
<li>display: list-item</li>
</ul>
<p style="padding-left:30px;">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.</p>
<p style="padding-left:30px;"> <img title="list-item" src="http://www.saffronstroke.com/wp-content/uploads/2009/07/list-item.jpg" alt="list-item" width="273" height="114" /> </p>
<ul>
<li>display: run-in</li>
</ul>
<p style="padding-left:30px;">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.</p>
<p style="padding-left:30px;"> <img class="alignnone size-full wp-image-589" title="run-in" src="http://www.saffronstroke.com/wp-content/uploads/2009/07/run-in.jpg" alt="run-in" width="262" height="113" /> </p>
<ul>
<li>display: inherit</li>
</ul>
<p style="padding-left:30px;">The element inherits its value from its parent element.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.saffronstroke.com/2009/07/07/most-used-values-of-the-display-property-in-css/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>

