Source code
Revision control
Copy as Markdown
Other Tools
Test Info:
- This WPT test may be referenced by the following Test IDs:
- /css/css-flexbox/align-items-baseline-overflow-non-visible.html - WPT Dashboard Interop Dashboard
<!DOCTYPE html>
<title>A block with 'overflow: hidden' should produce normal baseline</title>
<link rel="author" title="Koji Ishii" href="kojii@chromium.org">
<link rel="match" href="reference/align-items-baseline-overflow-non-visible-ref.html">
<link rel="stylesheet" type="text/css" href="/fonts/ahem.css">
<style>
.flex {
display: flex;
align-items: baseline;
font: 25px/1 Ahem;
}
.overflow {
overflow: hidden;
height: 2em;
}
</style>
<body>
<!--
CSS2 states that:
The baseline of an 'inline-block' is the baseline of its last line box in
the normal flow, unless it has either no in-flow line boxes or if its
'overflow' property has a computed value other than 'visible', in which case
the baseline is the bottom margin edge.
This rule should apply only to 'inline-block', and not to normal block.
-->
<div class="flex">
<span>XX</span>
<div><div class="overflow">YY</div></div>
</div>
</body>