inline-block-slice-7.html

Enable keyboard shortcuts

<!DOCTYPE html>

<!--

     Any copyright is dedicated to the Public Domain.

     http://creativecommons.org/publicdomain/zero/1.0/

-->

<html class="reftest-paged">

<head>

<style>

@page {

  size: 5in 3in;

  margin: 0.5in;

@font-face {

  font-family: Ahem;

  src: url(../fonts/Ahem.ttf);

html,body {

  color:black; background-color:white; font:20px/1 Ahem; padding:0; margin:0;

html { block-size: 1in; }

.ib {

  display: inline-block;

  inline-size: 2.5in;

  block-size: 3in;

  vertical-align: top;

  border: 5px solid black;

.ib > div {

  block-size: 3.25in; /* creates a bit of scrollable overflow on .ib */

.after {

  display: block;

  inline-size: 2.5in;

  block-size: 0.25in;

  border: 5px dashed grey;

  background-color: grey;

</style>

</head>

<body>

  <!--

    -- Note that the correct rendering is that the grey block placed

    -- immediately below the black bottom border.  Our fragmentation

    -- fallback mechanism can't handle this case correctly.

-->

  X<div class="ib"><div></div></div>p

  <div class="after"></div>

</body>

</html>