Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(823)

Issues Search
    My Issues | Starred     Open | Closed | All

Side by Side Diff: LayoutTests/fast/shapes/shape-outside-floats/shape-outside-floats-circle-005.html

Issue 115253003: Layout support for new circle shape syntax (Closed) Base URL: https://chromium.googlesource.com/chromium/blink.git@master
Patch Set: Update virtual/legacy-animations-engine/animations/interpolation/shape-outside-expected.txt Created 7 years ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch
« no previous file with comments | « LayoutTests/fast/shapes/shape-outside-floats/shape-outside-floats-circle-004-expected.html ('k') | LayoutTests/fast/shapes/shape-outside-floats/shape-outside-floats-circle-005-expected.html » ('j') | Source/core/rendering/shapes/Shape.cpp » ('J')
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
OLDNEW
1 <!DOCTYPE html> 1 <!DOCTYPE html>
2 <title>CSS Reference</title> 2 <title>Circle shape-outside on floats center set using keywords and offsets</tit le>
3 <link rel="author" title="Adobe" href="http://html.adobe.com/">
4 <link rel="author" title="Bem Jones-Bey" href="mailto:bjonesbe@adobe.com">
5 <link rel="help" href="http://dev.w3.org/csswg/css-shapes-1/#shape-outside-prope rty">
6 <meta name="flags" content="ahem">
7 <style> 3 <style>
8 .container { 4 .container {
9 font: 40px/1 Ahem, sans-serif; 5 font: 40px/1 Ahem, sans-serif;
10 line-height: 40px; 6 line-height: 40px;
11 width: 110px; 7 width: 110px;
12 height: 40px; 8 height: 40px;
13 overflow: hidden; 9 overflow: hidden;
14 white-space: nowrap; 10 white-space: nowrap;
15 background-color: red; 11 background-color: red;
16 color: green; 12 color: green;
17 } 13 }
18 14
19 .circle { 15 .circle {
20 width: 138px; 16 width: 80px;
21 height: 40px; 17 height: 40px;
22 background-color: green; 18 background-color: green;
23 } 19 }
20
21 .circle-right {
22 -webkit-shape-outside: circle(at top 20px left 20px) content-box;
23 }
24
25 .circle-left {
26 -webkit-shape-outside: circle(at bottom 20px right 20px) content-box;
27 }
24 </style> 28 </style>
25 29
26 <body> 30 <body>
27 <p>You should see a green rectangle. You shouldn't see any red.</p> 31 <p>You should see a green rectangle. You shouldn't see any red.</p>
28 <div class="container"> 32 <div class="container">
29 <div style="float: left" class="circle"></div> 33 <div style="float: left; margin-right: 40px;" class="circle circle-left"></d iv>
30 X 34 X
31 </div> 35 </div>
32 36
33 <div class="container" style="text-align: right"> 37 <div class="container" style="text-align: right">
34 <div style="float: right" class="circle"></div> 38 <div style="float: right; margin-left: 40px;" class="circle circle-right"></div>
35 X 39 X
36 </div> 40 </div>
37 </body> 41 </body>
OLDNEW
« no previous file with comments | « LayoutTests/fast/shapes/shape-outside-floats/shape-outside-floats-circle-004-expected.html ('k') | LayoutTests/fast/shapes/shape-outside-floats/shape-outside-floats-circle-005-expected.html » ('j') | Source/core/rendering/shapes/Shape.cpp » ('J')

Powered by Google App Engine
This is Rietveld 408576698