2 layer at (0,0) size 800x685
3 RenderView at (0,0) size 800x600
4 layer at (0,0) size 800x685
5 RenderBlock {HTML} at (0,0) size 800x685
6 RenderBody {BODY} at (8,16) size 784x644
7 RenderBlock {H1} at (0,0) size 784x56
8 RenderText {#text} at (0,1) size 726x54
9 text run at (0,1) width 726: "Problem: Safari improperly handles generated content in certain cases"
10 text run at (0,29) width 374: "when used with multiple class names"
11 RenderBlock {P} at (0,72) size 784x14
12 RenderInline {EM} at (0,0) size 660x14
13 RenderText {#text} at (0,0) size 660x14
14 text run at (0,0) width 660: "When referencing an element by two class names simultaneously, Safari won't generate content (using :before or :after) within the element."
15 RenderBlock {P} at (0,98) size 784x28
16 RenderText {#text} at (0,0) size 92x14
17 text run at (0,0) width 92: "Assume we have a "
18 RenderInline {CODE} at (0,0) size 18x11
19 RenderText {#text} at (92,3) size 18x11
20 text run at (92,3) width 18: "div"
21 RenderText {#text} at (110,0) size 110x14
22 text run at (110,0) width 110: " with two class names: "
23 RenderInline {CODE} at (0,0) size 18x11
24 RenderText {#text} at (220,3) size 18x11
25 text run at (220,3) width 18: "box"
26 RenderText {#text} at (238,0) size 23x14
27 text run at (238,0) width 23: " and "
28 RenderInline {CODE} at (0,0) size 18x11
29 RenderText {#text} at (261,3) size 18x11
30 text run at (261,3) width 18: "one"
31 RenderText {#text} at (279,0) size 61x14
32 text run at (279,0) width 61: ". Within that "
33 RenderInline {CODE} at (0,0) size 18x11
34 RenderText {#text} at (340,3) size 18x11
35 text run at (340,3) width 18: "div"
36 RenderText {#text} at (358,0) size 56x14
37 text run at (358,0) width 56: ", we have a "
38 RenderInline {CODE} at (0,0) size 6x11
39 RenderText {#text} at (414,3) size 6x11
40 text run at (414,3) width 6: "p"
41 RenderText {#text} at (420,0) size 774x28
42 text run at (420,0) width 354: " (paragraph) tag, after which we'd like to insert generated content. One way"
43 text run at (0,14) width 154: "to do so would be the following:"
44 RenderBlock {PRE} at (20,138) size 764x11 [color=#FF0000]
45 RenderInline {CODE} at (0,0) size 342x11
46 RenderText {#text} at (0,0) size 342x11
47 text run at (0,0) width 342: "div.box.one p:after{ content:'generated content here!'; }"
48 RenderBlock {P} at (0,161) size 784x14
49 RenderText {#text} at (0,0) size 550x14
50 text run at (0,0) width 550: "But that doesn't work in Safari. However, if you drop one of the class names, as shown below, it works as expected:"
51 RenderBlock {PRE} at (20,187) size 764x11 [color=#008000]
52 RenderInline {CODE} at (0,0) size 318x11
53 RenderText {#text} at (0,0) size 318x11
54 text run at (0,0) width 318: "div.box p:after{ content:'generated content here!'; }"
55 RenderBlock {P} at (0,210) size 784x14
56 RenderText {#text} at (0,0) size 215x14
57 text run at (0,0) width 215: "Note also that the bug only applies to content "
58 RenderInline {EM} at (0,0) size 29x14
59 RenderText {#text} at (215,0) size 29x14
60 text run at (215,0) width 29: "within"
61 RenderText {#text} at (244,0) size 200x14
62 text run at (244,0) width 200: " the classed element \x{2014} generating content "
63 RenderInline {EM} at (0,0) size 150x14
64 RenderText {#text} at (444,0) size 150x14
65 text run at (444,0) width 150: "before or after the element itself"
66 RenderText {#text} at (594,0) size 57x14
67 text run at (594,0) width 57: " works fine:"
68 RenderBlock {PRE} at (20,236) size 764x11 [color=#008000]
69 RenderInline {CODE} at (0,0) size 330x11
70 RenderText {#text} at (0,0) size 330x11
71 text run at (0,0) width 330: "div.box.one:after{ content:'generated content here!'; }"
72 RenderBlock {HR} at (0,257) size 784x2 [border: (1px inset #000000)]
73 RenderBlock {H2} at (0,273) size 784x21
74 RenderText {#text} at (0,0) size 361x20
75 text run at (0,0) width 361: "Example (view source to see CSS and HTML):"
76 RenderBlock {P} at (0,308) size 784x14
77 RenderText {#text} at (0,0) size 250x14
78 text run at (0,0) width 250: "Both boxes below should contain generated content ("
79 RenderInline {SPAN} at (0,0) size 38x14 [color=#008000]
80 RenderText {#text} at (250,0) size 38x14
81 text run at (250,0) width 38: "in green"
82 RenderText {#text} at (288,0) size 7x14
83 text run at (288,0) width 7: "):"
84 RenderBlock {DIV} at (0,347) size 784x136 [border: (1px solid #000000)]
85 RenderBlock {H3} at (26,40) size 732x16
86 RenderText {#text} at (0,0) size 34x15
87 text run at (0,0) width 34: "Box 1"
88 RenderBlock {P} at (26,70) size 732x28
89 RenderBlock (anonymous) at (0,0) size 732x14
90 RenderText {#text} at (0,0) size 487x14
91 text run at (0,0) width 487: "This box should contain the text \"generated content\" in CSS2-compliant browsers (but won't in Safari)."
92 RenderBlock (generated) at (0,14) size 732x14 [color=#008000]
93 RenderText at (0,0) size 82x14
94 text run at (0,0) width 82: "generated content"
95 RenderBlock {DIV} at (0,508) size 784x136 [border: (1px solid #000000)]
96 RenderBlock {H3} at (26,40) size 732x16
97 RenderText {#text} at (0,0) size 34x15
98 text run at (0,0) width 34: "Box 2"
99 RenderBlock {P} at (26,70) size 732x28
100 RenderBlock (anonymous) at (0,0) size 732x14
101 RenderText {#text} at (0,0) size 470x14
102 text run at (0,0) width 470: "This box should contain the text \"generated content\" in CSS2-compliant browsers, including Safari."
103 RenderBlock (generated) at (0,14) size 732x14 [color=#008000]
104 RenderText at (0,0) size 82x14
105 text run at (0,0) width 82: "generated content"
107 layer at (0,0) size 785x893
108 RenderView at (0,0) size 785x600
109 layer at (0,0) size 785x893
110 RenderBlock {HTML} at (0,0) size 785x893
111 RenderBody {BODY} at (8,21) size 769x847
112 RenderBlock {H1} at (0,0) size 769x74
113 RenderText {#text} at (0,0) size 750x73
114 text run at (0,0) width 750: "Problem: Safari improperly handles generated content"
115 text run at (0,37) width 716: "in certain cases when used with multiple class names"
116 RenderBlock {P} at (0,95) size 769x38
117 RenderInline {EM} at (0,0) size 755x38
118 RenderText {#text} at (0,0) size 755x38
119 text run at (0,0) width 755: "When referencing an element by two class names simultaneously, Safari won't generate content (using :before or :after)"
120 text run at (0,19) width 119: "within the element."
121 RenderBlock {P} at (0,149) size 769x38
122 RenderText {#text} at (0,0) size 123x19
123 text run at (0,0) width 123: "Assume we have a "
124 RenderInline {CODE} at (0,0) size 24x15
125 RenderText {#text} at (123,4) size 24x15
126 text run at (123,4) width 24: "div"
127 RenderText {#text} at (147,0) size 146x19
128 text run at (147,0) width 146: " with two class names: "
129 RenderInline {CODE} at (0,0) size 24x15
130 RenderText {#text} at (293,4) size 24x15
131 text run at (293,4) width 24: "box"
132 RenderText {#text} at (317,0) size 31x19
133 text run at (317,0) width 31: " and "
134 RenderInline {CODE} at (0,0) size 24x15
135 RenderText {#text} at (348,4) size 24x15
136 text run at (348,4) width 24: "one"
137 RenderText {#text} at (372,0) size 82x19
138 text run at (372,0) width 82: ". Within that "
139 RenderInline {CODE} at (0,0) size 24x15
140 RenderText {#text} at (454,4) size 24x15
141 text run at (454,4) width 24: "div"
142 RenderText {#text} at (478,0) size 76x19
143 text run at (478,0) width 76: ", we have a "
144 RenderInline {CODE} at (0,0) size 8x15
145 RenderText {#text} at (554,4) size 8x15
146 text run at (554,4) width 8: "p"
147 RenderText {#text} at (562,0) size 741x38
148 text run at (562,0) width 179: " (paragraph) tag, after which"
149 text run at (0,19) width 501: "we'd like to insert generated content. One way to do so would be the following:"
150 RenderBlock {PRE} at (20,203) size 749x15 [color=#FF0000]
151 RenderInline {CODE} at (0,0) size 456x15
152 RenderText {#text} at (0,0) size 456x15
153 text run at (0,0) width 456: "div.box.one p:after{ content:'generated content here!'; }"
154 RenderBlock {P} at (0,234) size 769x19
155 RenderText {#text} at (0,0) size 732x19
156 text run at (0,0) width 732: "But that doesn't work in Safari. However, if you drop one of the class names, as shown below, it works as expected:"
157 RenderBlock {PRE} at (20,269) size 749x15 [color=#008000]
158 RenderInline {CODE} at (0,0) size 424x15
159 RenderText {#text} at (0,0) size 424x15
160 text run at (0,0) width 424: "div.box p:after{ content:'generated content here!'; }"
161 RenderBlock {P} at (0,300) size 769x38
162 RenderText {#text} at (0,0) size 288x19
163 text run at (0,0) width 288: "Note also that the bug only applies to content "
164 RenderInline {EM} at (0,0) size 39x19
165 RenderText {#text} at (288,0) size 39x19
166 text run at (288,0) width 39: "within"
167 RenderText {#text} at (327,0) size 269x19
168 text run at (327,0) width 269: " the classed element \x{2014} generating content "
169 RenderInline {EM} at (0,0) size 763x38
170 RenderText {#text} at (596,0) size 763x38
171 text run at (596,0) width 167: "before or after the element"
172 text run at (0,19) width 29: "itself"
173 RenderText {#text} at (29,19) size 75x19
174 text run at (29,19) width 75: " works fine:"
175 RenderBlock {PRE} at (20,354) size 749x15 [color=#008000]
176 RenderInline {CODE} at (0,0) size 440x15
177 RenderText {#text} at (0,0) size 440x15
178 text run at (0,0) width 440: "div.box.one:after{ content:'generated content here!'; }"
179 RenderBlock {HR} at (0,382) size 769x2 [border: (1px inset #000000)]
180 RenderBlock {H2} at (0,403) size 769x28
181 RenderText {#text} at (0,0) size 477x28
182 text run at (0,0) width 477: "Example (view source to see CSS and HTML):"
183 RenderBlock {P} at (0,450) size 769x19
184 RenderText {#text} at (0,0) size 335x19
185 text run at (0,0) width 335: "Both boxes below should contain generated content ("
186 RenderInline {SPAN} at (0,0) size 51x19 [color=#008000]
187 RenderText {#text} at (335,0) size 51x19
188 text run at (335,0) width 51: "in green"
189 RenderText {#text} at (386,0) size 9x19
190 text run at (386,0) width 9: "):"
191 RenderBlock {DIV} at (0,494) size 769x164 [border: (1px solid #000000)]
192 RenderBlock {H3} at (26,44) size 717x22
193 RenderText {#text} at (0,0) size 48x22
194 text run at (0,0) width 48: "Box 1"
195 RenderBlock {P} at (26,84) size 717x38
196 RenderBlock (anonymous) at (0,0) size 717x19
197 RenderText {#text} at (0,0) size 650x19
198 text run at (0,0) width 650: "This box should contain the text \"generated content\" in CSS2-compliant browsers (but won't in Safari)."
199 RenderBlock (generated) at (0,19) size 717x19 [color=#008000]
200 RenderText at (0,0) size 111x19
201 text run at (0,0) width 111: "generated content"
202 RenderBlock {DIV} at (0,683) size 769x164 [border: (1px solid #000000)]
203 RenderBlock {H3} at (26,44) size 717x22
204 RenderText {#text} at (0,0) size 48x22
205 text run at (0,0) width 48: "Box 2"
206 RenderBlock {P} at (26,84) size 717x38
207 RenderBlock (anonymous) at (0,0) size 717x19
208 RenderText {#text} at (0,0) size 628x19
209 text run at (0,0) width 628: "This box should contain the text \"generated content\" in CSS2-compliant browsers, including Safari."
210 RenderBlock (generated) at (0,19) size 717x19 [color=#008000]
211 RenderText at (0,0) size 111x19
212 text run at (0,0) width 111: "generated content"
213 >>>>>>> 6448a48e03586d4121fcff9ca92e9ee862e1d77d
projects / profile / ivi / webkit-efl.git / blob