Auto merge of #29719 - stshine:flexbox-justify-content, r=Loirooriol

layout 2020: Implement justify-content in flexbox

Align the items along the main-axis per justify-content.

<!-- Please describe your changes on the following line: -->

---
<!-- Thank you for contributing to Servo! Please replace each `[ ]` by `[X]` when the step is complete, and replace `___` with appropriate data: -->
- [x] `./mach build -d` does not report any errors
- [x] `./mach test-tidy` does not report any errors
- [ ] These changes fix #___ (GitHub issue number if applicable)

<!-- Either: -->
- [x] There are tests for these changes OR
- [ ] These changes do not require tests because ___

<!-- Also, please make sure that "Allow edits from maintainers" checkbox is checked, so that we can help you if you get stuck somewhere along the way.-->

<!-- Pull requests that do not address these steps are welcome, but they will require additional verification as part of the review process. -->

components/style/properties/longhands/position.mako.rs

@@ -92,12 +92,13 @@ ${helpers.single_keyword(
     gecko_enum_prefix = "StyleFlexWrap",
 )}
 
-% if engine == "servo-2013":
+% if engine in ["servo-2013", "servo-2020"]:
     // FIXME: Update Servo to support the same Syntax as Gecko.
     ${helpers.single_keyword(
         "justify-content",
         "flex-start stretch flex-end center space-between space-around",
-        engines="servo-2013",
+        engines="servo-2013 servo-2020",
+        servo_2020_pref="layout.flexbox.enabled",
         extra_prefixes="webkit",
         spec="https://drafts.csswg.org/css-align/#propdef-justify-content",
         animation_value_type="discrete",