LayoutTests/fast/regions/region-styling/region-style-block-background-color.html - Issue 159863002: Remove CSS regions support, keeping a bare minimum to support "region-based" multicol.

Side by Side Diff: LayoutTests/fast/regions/region-styling/region-style-block-background-color.html

Issue 159863002: Remove CSS regions support, keeping a bare minimum to support "region-based" multicol. (Closed) Base URL: https://chromium.googlesource.com/chromium/blink.git@master

Patch Set: Created 6 years, 10 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

« no previous file with comments | « LayoutTests/fast/regions/region-styling/region-rule-nested-region-rule-expected.html ('k') | LayoutTests/fast/regions/region-styling/region-style-block-background-color-expected.html » ('j') | Source/devtools/front_end/protocol_externs.js » ('J')
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Hide Comments ('s')

OLD	NEW
	(Empty)
1 <!doctype html>

2 <html>

3 <!--

4 Test for https://bugs.webkit.org/show_bug.cgi?id=71488 (Add support for back ground-color in region styling).

5 Test setting the background-color property using region styling fox boxes.

6 You should not see any red background below.

7 -->

8 <head>

9 <style>

10 html { font: 16px/1.25 monospace; }

11 .regionTextBlock { background-color: red; }

12 .regionBox { width: 420px; height: 50px; }

13 .regionBox1 { width: 420px; height: 30px; }

14

15 #article1 { -webkit-flow-into: flow1; }

16 #region1 { -webkit-flow-from: flow1; }

17 @-webkit-region #region1 { #regionTextBlock1 { background-color: gre en; } }

18

19 #article2 { -webkit-flow-into: flow2; }

20 #region21, #region22 { -webkit-flow-from: flow2; }

21 @-webkit-region #region21 { #regionTextBlock2 { background-color: gr een; } }

22 @-webkit-region #region22 { #regionTextBlock3 { background-color: li me; } }

23

24 #article3 { -webkit-flow-into: flow3; }

25 #region31, #region32 { -webkit-flow-from: flow3; }

26 @-webkit-region #region31 { #regionTextBlock4 { background-color: gr een; } }

27 @-webkit-region #region32 { #regionTextBlock4 { background-color: li me; } }

28

29 #article41 { -webkit-flow-into: flow41; }

30 #region41 { -webkit-flow-from: flow41; }

31 #article42 { -webkit-flow-into: flow42; }

32 #region42 { -webkit-flow-from: flow42; }

33 @-webkit-region #region41 {

34 #regionTextBlock5 { background-color: green; }

35 #regionTextBlock6 { background-color: green; }

36 }

37 @-webkit-region #region42 {

38 #regionTextBlock7 { background-color: lime; }

39 #regionTextBlock8 { background-color: lime; }

40 }

41

42 #article5 { -webkit-flow-into: flow5; }

43 #region5 { -webkit-flow-from: flow5; }

44 @-webkit-region #region5 {

45 #regionTextBlock9 { background-color: green; }

46 }

47

48 #article6 { -webkit-flow-into: flow6; }

49 #region6 { -webkit-flow-from: flow6; }

50 @-webkit-region #region6 { #regionTextBlock10 { background-color: tr ansparent; } }

51

52 #article7 { -webkit-flow-into: flow7; }

53 #region71 { -webkit-flow-from: flow7; }

54 #region72 { -webkit-flow-from: flow7; }

55 #regionTextBlock11 { background-color: green; }

56 @-webkit-region #region71 { #regionTextBlock11 { background-color: t ransparent; } }

57 </style>

58 </head>

59 <body class="body">

60 <!-- Style a single paragraph in a single region -->

61 <div id="article1">

62 <div class="regionTextBlock" id="regionTextBlock1">Green background text styled in region1.</div>

63 </div>

64 <div id="region1" class="regionBox1"></div>

65

66 <!-- Style separate paragraphs in different regions -->

67 <div id="article2">

68 <div class="regionTextBlock" id="regionTextBlock2">Green background text styled in region21.</div></br>

69 <div class="regionTextBlock" id="regionTextBlock3">Lime background t ext styled in region22.</div>

70 </div>

71 <div id="region21" class="regionBox"></div>

72 <div id="region22" class="regionBox1"></div>

73

74 <!-- Style a single paragraph in different regions -->

75 <div id="article3">

76 <div class="regionTextBlock" id="regionTextBlock4">Green background text styled in region31. Lime background text styled in region32. Lime backgroun d text styled in region32. Green background text styled in region31.</div></br>

77 </div>

78 <div id="region31" class="regionBox1"></div>

79 <div id="region32" class="regionBox"></div>

80 <div id="region31" class="regionBox1"></div>

81

82 <!-- Style paragraphs in alternate regions -->

83 <div id="article41">

84 <div class="regionTextBlock" id="regionTextBlock5">Green background text styled in region 41.</div></br>

85 <div class="regionTextBlock" id="regionTextBlock6">Green background text styled in region 41.</div></br>

86 </div>

87 <div id="article42">

88 <div class="regionTextBlock" id="regionTextBlock7">Lime background t ext styled in region 42.</div></br>

89 <div class="regionTextBlock" id="regionTextBlock8">Lime background t ext styled in region 42.</div></br>

90 </div>

91 <div id="region41" class="regionBox"></div>

92 <div id="region42" class="regionBox"></div>

93 <div id="region41" class="regionBox1"></div>

94 <div id="region42" class="regionBox1"></div>

95

96 <!-- Style paragraph in region, text also styled. -->

97 <div id="article5">

98 <div class="regionTextBlock" id="regionTextBlock9"><i><b>Green backg round, styled text in region5.</b></i></div>

99 </div>

100 <div id="region5" class="regionBox1"></div>

101

102 <!-- Style paragraph in region, transparent background. -->

103 <div id="article6">

104 <div class="regionTextBlock" id="regionTextBlock10">Transparent back ground text in region6.</b></i></div>

105 </div>

106 <div id="region6" class="regionBox1"></div>

107

108 <!-- Style paragraph in two regions, first region resets background, sec ond region should have background -->

109 <div id="article7">

110 <div class="regionTextBlock" id="regionTextBlock11">Transparent back ground text in region71. Green background text in region 72.</div>

111 </div>

112 <div id="region71" class="regionBox1"></div>

113 <div id="region72" class="regionBox1"></div>

114 </body>

115 </html>

OLD	NEW