mirror of
https://github.com/servo/servo.git
synced 2025-06-24 00:54:32 +01:00
59 lines
No EOL
1.8 KiB
HTML
59 lines
No EOL
1.8 KiB
HTML
<!DOCTYPE html>
|
|
<html><head>
|
|
<title>CSS Reftest Reference</title>
|
|
<link href="mailto:mibalan@adobe.com" rel="author" title="Mihai Balan">
|
|
<link href="../support/common.css" rel="stylesheet">
|
|
<style>
|
|
.editable-container {
|
|
width: 300px;
|
|
border: 2px solid blue;
|
|
}
|
|
.editable {
|
|
font-family: Times, serif;
|
|
font-size: 20px;
|
|
line-height: 1em;
|
|
}
|
|
.region {
|
|
width: 300px;
|
|
height: 200px;
|
|
border: 2px solid black;
|
|
margin: .5em 0 .5em 0;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<ol>
|
|
<li>Below you should see a rectangle with a blue border and a rectangle with a black border.
|
|
The blue rectangle should have one block of text inside it and the black rectangle
|
|
should have two blocks of text inside it. No red should be visible at any time during
|
|
this test.</li>
|
|
<li>Double click on the word “editable” in the blue rectangle and type
|
|
“foobar bazquux”.
|
|
<ul>
|
|
<li>The word “editable” should be replaced with “foobar bazquux”.</li>
|
|
</ul>
|
|
</li>
|
|
<li>Repeat the steps above, but for the two occurrences of the word “editable”
|
|
in the black rectangle. The expected results are the same as for the previous step.
|
|
</li>
|
|
</ol>
|
|
|
|
<div contenteditable="true" class="editable-container">
|
|
<p class="editable">
|
|
This text should be displayed outside of the black border and <span id="marked-outside">foobar bazquux</span>.
|
|
</p>
|
|
</div>
|
|
|
|
<div class="region">
|
|
<div contenteditable="true">
|
|
<p class="editable">
|
|
This text should be displayed inside the black border and it should also be <span id="marked-inside">foobar bazquux</span>.
|
|
</p>
|
|
<p class="editable">
|
|
This text should also be displayed inside the black border and <span id="marked-inside-new">foobar bazquux</span>.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
</body></html> |