layout/reftests/w3c-css/submitted/shapes1/shape-outside-border-box-border-radius-002.html
author Tyler Maklebust <maklebus@msu.edu>
Mon, 19 Dec 2016 21:10:54 -0500
changeset 325625 550922e8b2234ceb7bd8eb1e738c14ff8bff56ee
parent 322826 e8665b1b664cadbcd383e805aeaafd08dece138e
permissions -rw-r--r--
Bug 1309935 - Add ability to find within select dropdown when over 40 elements. r?jaws, mconley, enndeakin Search implemented for select dropdown options. List navigation takes keyboard input as before, until search field is focused. Pref added to enable search (dom.forms.selectSearch). Task added to test search functionality. MozReview-Commit-ID: BiKRvNbQnxx

<!DOCTYPE html>
<!-- Any copyright is dedicated to the Public Domain.
   - http://creativecommons.org/publicdomain/zero/1.0/ -->

<html>
  <meta charset="utf-8">
  <title>CSS Shape Test: float left, border-box, border-radius, no margin</title>
  <link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
  <link rel="author" title="Mozilla" href="http://www.mozilla.org/">
  <link rel="help" href="https://drafts.csswg.org/css-shapes-1/#shapes-from-box-values">
  <link rel="match" href="shape-outside-border-box-border-radius-002-ref.html">
  <meta name="flags" content="">
  <meta name="assert" content="Test the boxes are wrapping around the left float shape defined by the border-box and border-radius value.">
  <style>
  .container {
    width: 200px;
    line-height: 0;
  }

  .shape {
    float: left;
    shape-outside: border-box;
    border-radius: 50%;
    box-sizing: content-box;
    height: 40px;
    width: 40px;
    padding: 20px;
    border: 20px solid lightgreen;
    /* No margin. */
    background-color: orange;
  }

  .box {
    display: inline-block;
    width: 60px;
    background-color: blue;
  }
  </style>

  <body class="container">
    <div class="shape"></div>
    <div class="box" style="height: 24px;"></div> <!-- Box at corner -->
    <div class="box" style="height: 36px;"></div>
    <div class="box" style="height: 36px;"></div>
    <div class="box" style="height: 24px;"></div> <!-- Box at corner -->
</body>
</html>