Skip to main content

Browse the archive

Revision 28d63f19babbd14a18a0219acf21362fc5d52dbc authored by Henrik Skupin on 28 March 2018, 18:49:31 UTC, committed by moz-wptsync-bot on 28 March 2018, 18:49:31 UTC 
Find element for (partial) link text has to use rendered content.
 
To retrieve links via "link text" or "partial link text" the rendered
content of the element has to be used. This can be the case for CSS
transformations like "uppercase".
bugzilla-url: https://bugzilla.mozilla.org/show_bug.cgi?id=1381519
gecko-commit: 3e204686f1b10441f48435890241dff6706d04dd
gecko-integration-branch: central
gecko-reviewers: ato
1 parent f5b48cf
Raw File
flexbox-flex-direction-column.htm 
<!DOCTYPE html>
<html>
	<head>
		<title>CSS Flexbox Test: Flex-direction = column</title>
		<link rel="author" title="Gavin Elster" href="mailto:gavin.elster@me.com">
		<link rel="reviewer" title="Elika J. Etemad" href="http://fantasai.inkedblade.net/contact">
		<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#flex-direction-property">
		<link rel="match" href="reference/flexbox-flex-direction-ref.htm" />
		<meta name="flags" content="">
		<meta name="assert" content="Test checks that flex container's main axis has the same orientation as the block axis of the current writing mode, when flex-direction = column. This assumes writing-direction = horizontal-tb', and direction = 'ltr'.">
		<style>

		/* Test specific Styles */

			.flex-wrapper {
				display: flex;
				flex-direction: column;
				flex-wrap: wrap;
			}

		/* Test-series styles */

			.flex-wrapper {
				width:  120px;
				height: 120px;

				/* should only display on error */
				background: red;

				/* Enforce writing mode */
				direction: ltr;
				writing-mode: horizontal-tb;
			}

			.flex-wrapper div {
				width:  38px;
				height: 38px;

				background: green;
				border: 1px solid limegreen;

				color: white;
				line-height: 40px;
				text-align: center;
				vertical-align: middle;
			}
		</style>
	</head>
	<body>
		<p>The test passes if there is a 3x3 grid of green squares, numbered 1-9 left-to-right and top-to-bottom, and there is no red.</p>
		<div class="flex-wrapper">
			<div>1</div><div>4</div><div>7</div>
			<div>2</div><div>5</div><div>8</div>
			<div>3</div><div>6</div><div>9</div>
		</div>
	</body>
</html>
back to top