Tests/Data/VisualTests/inline_block.rml

<rml>
<head>
    <title>Inline-block</title>
    <link type="text/rcss" href="../style.rcss"/>
	<link rel="help" href="https://www.w3.org/TR/2011/REC-CSS2-20110607/visudet.html#inlineblock-width" />
	<link rel="help" href="https://www.w3.org/TR/2011/REC-CSS2-20110607/visudet.html#leading" />
	<meta name="Description" content="Elements with 'display: inline-block' should shrink-to-fit when no width is specified. The baseline of the element should be the baseline of its last line." />
	<style>
		body {
			background: #ddd;
			color: #444;
		}
		.float {
			color: #393;
		}
		.left {
			float: left;
		}
		.right {
			float: right;
		}
		.iblock {
			display: inline-block;
			color: #33c;
		}
		.iblock p {
			text-align: right;
		}
	</style>
</head>

<body>
<div>The following text <div class="iblock">is an inline-block</div> and should flow naturally.</div>
<hr/>
<div>Left filler text <div class="iblock">meets an inline-block<br/>with a line-break</div> right filler text.</div>
<hr/>
<div>Left filler text. <div class="iblock">An inline-block. <p>A paragraph</p> Filler text.</div> Right filler text.</div>
<hr/>
<div>Left filler text. <div class="iblock">An inline-block. <div class="float right">Float right</div><div class="float left">Float left</div> Filler text.</div> Right filler text.</div>
<hr/>
<div class="iblock">Nesting inline-blocks: 
	<div class="iblock">A<div class="iblock">B<div class="iblock">C</div></div></div>
	<div class="iblock">D<div class="iblock">E<div class="iblock">F</div></div></div>
</div>
</body>
</rml>