[Title] [CherryPick] new flexbox should ignore float set on flexitems
[Issue] TWEB-826
[Problem] WebAPI/W3C_CSS3/FlexibleBox/CSS3FlexBox_display_float.html test case failed.
[Cause] In the test case, the item in flexbox have float:right, but it should be disallowed.
[Solution] Cherry-pick the opensource patch.
[Cherry-Picker] KyungTae Kim <ktf.kim@samsung.com>
new flexbox should ignore float set on flexitems
https://bugs.webkit.org/show_bug.cgi?id=70792
Reviewed by Ojan Vafai.
Source/WebCore:
Force flex items to not float.
Test: css3/flexbox/floated-flexitem.html
* css/StyleResolver.cpp:
(WebCore::StyleResolver::adjustRenderStyle): Force NoFloat on flex items.
LayoutTests:
Make an example in the spec into a ref test. Add some styles to make it a bit more clear what's happening.
* css3/flexbox/floated-flexitem-expected.html: Added.
* css3/flexbox/floated-flexitem.html: Added.
git-svn-id: http://svn.webkit.org/repository/webkit/trunk@124064
268f45cc-cd09-0410-ab3c-
d52691b4dbfc
Change-Id: I1b17a729a10edc4d9cc9e74ab4e038630b1eadad
--- /dev/null
+<!DOCTYPE html>
+<html>
+<style>
+#flexbox {
+ background-color: lightgrey;
+}
+#flexbox > * {
+ border: 1px solid green;
+ vertical-align: top;
+}
+</style>
+<body>
+<p>
+This example is from the spec. There should be four flex items. Anonymous item 3 shouldn't have
+a green border because the anonymous block is the flex item.
+</p>
+<div id="flexbox">
+ <div style="display: inline-block">block</div><div
+ style="display: inline-block">float</div><div
+ style="display: inline-block; border: 0">anonymous item 3</div><div
+ style="display: inline-block">
+ item 4<br>
+ item 4<br>
+ item 4
+ </div>
+</div>
+</body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<html>
+<style>
+#flexbox {
+ background-color: lightgrey;
+ -webkit-align-items: flex-start;
+}
+#flexbox > * {
+ border: 1px solid green;
+}
+</style>
+<body>
+<p>
+This example is from the spec. There should be four flex items. Anonymous item 3 shouldn't have
+a green border because the anonymous block is the flex item.
+</p>
+<div id="flexbox" style="display: -webkit-flex">
+
+ <!-- flex item: block child -->
+ <div id="item1">block</div>
+
+ <!-- flex item: floated element; floating is ignored -->
+ <div id="item2" style="float: left;">float</div>
+
+ <!-- flex item: anonymous block box around inline content -->
+ anonymous item 3
+
+ <!-- flex item: inline child -->
+ <span>
+ item 4
+ <!-- flex items do not split around blocks -->
+ <div id=not-an-item>item 4</div>
+ item 4
+ </span>
+</div>
+</body>
+</html>
if (style->writingMode() != TopToBottomWritingMode && (style->display() == BOX || style->display() == INLINE_BOX))
style->setWritingMode(TopToBottomWritingMode);
- if (e && e->parentNode() && e->parentNode()->renderer() && e->parentNode()->renderer()->isFlexibleBox())
+ if (e && e->parentNode() && e->parentNode()->renderer() && e->parentNode()->renderer()->isFlexibleBox()) {
+ style->setFloating(NoFloat);
style->setDisplay(equivalentBlockDisplay(style->display(), style->isFloating(), m_checker.strictParsing()));
+ }
}
// Make sure our z-index value is only applied if the object is positioned.
projects / framework / web / webkit-efl.git / commitdiff