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

Side by Side Diff: LayoutTests/fast/css/object-fit-grow-portrait-expected.html

Issue 22482004: Add support for the object-fit CSS property. (Closed) Base URL: https://chromium.googlesource.com/chromium/blink.git@master
Patch Set: Oops, sorry! Forgot to update UseCounter.cpp Created 7 years, 4 months 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
OLDNEW
(Empty)
1 <!DOCTYPE html>
2
3 <html>
4 <head>
5 <title>object-fit, portrait images smaller than content box</title>
6 <style type="text/css">
7 .group > div {
8 display: inline-block;
9 overflow: hidden;
10 height: 144px;
11 width: 144px;
12 margin: 10px;
13 border: 1px solid black;
14 background-color: gray;
15 }
16 div > * > * { display:block; }
17 .group.portrait > *:nth-child(1) > * { width:100%; height:100%; }
18 .group.portrait > *:nth-child(2) > * { height:100%; margin-left:25%; }
19 .group.portrait > *:nth-child(3) > * { width:100%; margin-top:-50%; }
20 .group.portrait > *:nth-child(4) > * { margin-top:36px; margin-left:54px; }
21 .group.portrait > *:nth-child(5) > * { margin-top:36px; margin-left:54px; }
22 </style>
23 </head>
24 <body>
25
26 <!-- Small images, should be scaled up when allowed. -->
27 <div class="group portrait">
28 <div><img src="resources/circles-portrait-small.png"></div>
29 <div><img src="resources/circles-portrait-small.png"></div>
30 <div><img src="resources/circles-portrait-small.png"></div>
31 <div><img src="resources/circles-portrait-small.png"></div>
32 <div><img src="resources/circles-portrait-small.png"></div>
33 </div>
34 </body>
35 </html>
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698