| Index: LayoutTests/fast/regions/shape-inside/shape-inside-with-region-borders.html
|
| diff --git a/LayoutTests/fast/regions/shape-inside/shape-inside-with-region-borders.html b/LayoutTests/fast/regions/shape-inside/shape-inside-with-region-borders.html
|
| new file mode 100644
|
| index 0000000000000000000000000000000000000000..4223556633cfd8399440ca6419cd28f405e6c61b
|
| --- /dev/null
|
| +++ b/LayoutTests/fast/regions/shape-inside/shape-inside-with-region-borders.html
|
| @@ -0,0 +1,46 @@
|
| +<!DOCTYPE html>
|
| +<html>
|
| +<head>
|
| +<script>
|
| + if (window.internals)
|
| + window.internals.settings.setCSSExclusionsEnabled(true);
|
| +</script>
|
| +<style>
|
| + #content {
|
| + font: 20px Ahem, sans-serif;
|
| + -webkit-font-smoothing: none;
|
| + -webkit-flow-into: flow;
|
| + }
|
| + .region {
|
| + width: 300px;
|
| + height: 300px;
|
| + background-color: yellow;
|
| + border-top: 10px solid lightgreen;
|
| + border-right: 20px solid green;
|
| + border-bottom: 30px solid lightblue;
|
| + border-left: 40px solid blue;
|
| + -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. There should be an equally 50-50px left and right offset for the content in the content box. The borders shouldn't have any effect on the shape-inside's rectangle.
|
| +<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