| Index: LayoutTests/fast/regions/shape-inside/shape-inside-with-region-padding.html
|
| diff --git a/LayoutTests/fast/regions/shape-inside/shape-inside-with-region-padding.html b/LayoutTests/fast/regions/shape-inside/shape-inside-with-region-padding.html
|
| new file mode 100644
|
| index 0000000000000000000000000000000000000000..0edf3ca1900ba0e56258e5af3958a95d7b5fe7de
|
| --- /dev/null
|
| +++ b/LayoutTests/fast/regions/shape-inside/shape-inside-with-region-padding.html
|
| @@ -0,0 +1,47 @@
|
| +<!DOCTYPE html>
|
| +<html>
|
| +<head>
|
| +<script>
|
| + if (window.internals)
|
| + window.internals.settings.setCSSExclusionsEnabled(true);
|
| +</script>
|
| +<style>
|
| + #content {
|
| + font: 18px Ahem, sans-serif;
|
| + line-height: 20px;
|
| + -webkit-flow-into: flow;
|
| + }
|
| + .region {
|
| + width: 300px;
|
| + height: 300px;
|
| + background-color: yellow;
|
| + border: 1px solid black;
|
| + padding-top: 10px;
|
| + padding-right: 20px;
|
| + padding-bottom: 30px;
|
| + padding-left: 40px;
|
| + -webkit-flow-from: flow;
|
| + }
|
| + #shape_inside {
|
| + -webkit-shape-inside: rectangle(50px, 0px, 200px, 300px);
|
| + background-color: orange;
|
| + }
|
| +</style>
|
| +</head>
|
| +<body>
|
| +
|
| +<div id="shape_inside" class="region"></div>
|
| +
|
| +<div id="content">
|
| + XXXXXXXXXX XXXXXXXXXX XXXXXXXXXX XXXXXXXXXX
|
| + XXXXXXXXXX XXXXXXXXXX XXXXXXXXXX XXXXXXXXXX
|
| + XXXXXXXXXX XXXXXXXXXX XXXXXXXXXX XXXXXXXXXX
|
| + XXXXXXXXXX XXXXXXXXXX XXXXXXXXXX
|
| +</div>
|
| +
|
| +<p>Requires Ahem font. The content flows into a region (300px wide) what contains a shape-inside rectangle (200px wide) with 50px left offset.<br/>
|
| +The content should fill the shape-inside area out. The different paddings (top 10, right 20, bottom 30, left 40px) should be applied on the container. The padding shouldn't have any effect on the shape-inside's content.
|
| +<p>Bug <a href="http://webkit.org/b/115456">115456</a>: [CSS Regions][CSS Exclusions] Shape-inside on regions should respect region borders and paddings</p>
|
| +
|
| +</body>
|
| +</html>
|
|
|
Chromium Code Reviews
Issue 19865002:
[CSS Shapes] Port shape-inside on regions and shape's content overflow from WebKit (Closed)
Base URL: https://chromium.googlesource.com/chromium/blink.git@master