42 lines
1.1 KiB
HTML
42 lines
1.1 KiB
HTML
<!DOCTYPE html>
|
|
<link rel="help" href="https://drafts.csswg.org/css-align/#distribution-block">
|
|
<script src="/resources/testharness.js"></script>
|
|
<script src="/resources/testharnessreport.js"></script>
|
|
|
|
<style>
|
|
@import "/fonts/ahem.css";
|
|
body {
|
|
font: 10px/1 Ahem;
|
|
margin: 0;
|
|
}
|
|
.target {
|
|
height: 50px;
|
|
align-content: unsafe center;
|
|
}
|
|
</style>
|
|
|
|
<div class="target">
|
|
<div class="content">foo</div>
|
|
</div>
|
|
|
|
<script>
|
|
const supportedValues = ['block', 'flow', 'flow-root', 'inline-block',
|
|
'list-item', 'flow-root list-item', 'table-caption'];
|
|
const unsupportedValues = ['ruby-text'];
|
|
|
|
const target = document.querySelector('.target');
|
|
const content = document.querySelector('.content');
|
|
for (let value of supportedValues) {
|
|
test(() => {
|
|
target.style.display = value;
|
|
assert_equals(content.offsetTop, 20);
|
|
}, `display:${value} should support align-content`);
|
|
}
|
|
|
|
for (let value of unsupportedValues) {
|
|
test(() => {
|
|
target.style.display = value;
|
|
assert_not_equals(content.offsetTop, 20);
|
|
}, `display:${value} should not support align-content`);
|
|
}
|
|
</script>
|