Skip to main content

Browse the archive

https://github.com/mozilla/gecko-dev
16 June 2024, 00:10:27 UTC
Raw File
Tip revision: 7df98325f68bad5911813a59d751dbfd6efab382 authored by ffxbld on 09 December 2016, 02:14:37 UTC
Added FENNEC_50_1_0_RELEASE FENNEC_50_1_0_BUILD2 tag(s) for changeset aed42f9ce9f7. DONTBUILD CLOSED TREE a=release
Tip revision: 7df9832
CSS21-t100301.xhtml 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
	<head>
		<title>CSS 2.1 Test Suite: Inline, non-replaced elements</title>
		<link rel="author" title="L. David Baron" href="http://dbaron.org/" />
		<link rel="author" title="Mozilla Corporation" href="http://mozilla.com/" />
		<link rel="help" href="http://www.w3.org/TR/CSS21/visudet.html#inline-width" />
		<meta name="flags" content="ahem" />
		<style type="text/css"><![CDATA[

		@font-face {
			src: url(../fonts/Ahem.ttf);
 			font-family: Ahem;
        }

		html { background: white; }

		body {
			width: 100px; height: 100px;
			border: 10px solid lime; background: red;
            font: 20px/1 Ahem;
		}

		span { background: red; color: green; }

		.X::before, .space::before { background:green; color:transparent; }
		.X::before { content:"X"; }
		.space::before { content:" "; }

		]]></style>
	</head>
	<body>

	<!-- First row -->
	<!-- The width property does not apply -->
	<!-- check padding-left and border-right too -->
	<span style="width: 1px"><span class="X"></span></span
	><span style="width: 200px"><span class="X"></span></span
	><span style="width: 10px; padding-left: 10px;background:green"><span class="X"></span></span
	><span style="border-right: 10px solid green; width: 40px"><span class="X"></span></span>

	<!-- Second row -->
	<!-- auto values for margin-left and margin-right are zero -->
	<span style="background:green"
		><span style="margin-right: auto"><span class="X"></span></span
		><span style="margin-left: 5px"><span class="X"></span></span
		><span style="margin-left:auto;background:green"><span class="space"></span></span
		><span style="margin-right: 15px"><span class="X"></span></span
	></span>

	<!-- Third row -->
	<!-- auto values for left and right are 0, and other values don't
	     do anything either, unless we have position:relative -->
	<span style="left: auto"><span class="X"></span></span
	><span style="left:8px"><span class="X"></span></span
	><span style="right:73px"><span class="X"></span></span
	><span style="right:auto"><span class="X"></span></span
	><span style="background:transparent;color:red"><span class="X"></span><span style="position:relative;right:20px"><span class="X"></span></span></span>

	<!-- Fourth row -->
	<!-- toss in some negative and adjacent margins -->
	<span style="margin-right: -5px;color:red;background:red"><span class="X"></span></span
	><span style="margin-left: -15px"><span class="X"></span></span
	><span style="background:green"
		><span style="margin-right:25px"><span class="X"></span></span
		><span style="margin-left: 15px"><span class="X"></span></span
	></span>

	<!-- Fifth row -->
	<!-- border and padding and margin -->
	<span style="margin-left:15px; margin-right:348px"
		><span style="background: green; margin-left:-15px; border-left: 15px solid; padding-left: 25px;padding-right: 8px;border-right:32px solid;"><span class="X"></span></span
	></span>

	</body>
</html>
back to top