New article "Inspect and debug CSS flexbox layouts"

[mikehoffms]

Rendered article sections for review:

• Inspect and debug CSS flexbox layouts
  • \devtools\css\flexbox.md
  • Internal preview: https://review.learn.microsoft.com/microsoft-edge/devtools/css/flexbox?branch=pr-en-us-3859
  • External preview:
  • Upstream: https://developer.chrome.com/docs/devtools/css/flexbox
  • Planned live: https://review.learn.microsoft.com/microsoft-edge/devtools/css/flexbox
  • New article.

---

Incidental files

tbd

AB#63043805

[learn-build-service-prod]

PoliCheck Scan Report

The following report lists PoliCheck issues in PR files. Before you merge the PR, you must fix all severity-1 and severity-2 issues. The AI Review Details column lists suggestions for either removing or replacing the terms. If you find a false positive result, mention it in a PR comment and include this text: #policheck-false-positive. This feedback helps reduce false positives in future scans.

✅ No issues found

More information about PoliCheck

Information: PoliCheck | Severity Guidance | Term
For any questions: Try searching the learn.microsoft.com contributor guides or post your question in the Learn support channel.

[learn-build-service-prod]

Learn Build status updates of commit e8bb386:

💡 Validation status: suggestions

File	Status	Preview URL	Details
microsoft-edge/devtools/css/flexbox.md	💡Suggestion	View	Details
microsoft-edge/devtools/elements-tool/elements-tool.md	✅Succeeded	View
microsoft-edge/devtools/experimental-features/index.md	✅Succeeded	View
microsoft-edge/devtools/inspect-styles/edit-fonts.md	✅Succeeded	View
microsoft-edge/devtools/sources/index.md	✅Succeeded	View
microsoft-edge/devtools/whats-new/2020/05/devtools.md	✅Succeeded	View
microsoft-edge/devtools/whats-new/2020/08/devtools.md	✅Succeeded	View
microsoft-edge/devtools/whats-new/2020/11/devtools.md	✅Succeeded	View
microsoft-edge/devtools/whats-new/2021/01/devtools.md	✅Succeeded	View
microsoft-edge/devtools/whats-new/2021/02/devtools.md	✅Succeeded	View
microsoft-edge/toc.yml	✅Succeeded	View

microsoft-edge/devtools/css/flexbox.md

• Line 0, Column 0: [Suggestion: filename-incomplete - See documentation] The filename contains an incomplete word, misspelled word, acronym, or abbreviation that is disallowed.

For more details, please refer to the build report.

Note: Your PR may contain errors or warnings or suggestions unrelated to the files you changed. This happens when external dependencies like GitHub alias, Microsoft alias, cross repo links are updated. Please use these instructions to resolve them.

[learn-build-service-prod]

PoliCheck Scan Report

The following report lists PoliCheck issues in PR files. Before you merge the PR, you must fix all severity-1 and severity-2 issues. The AI Review Details column lists suggestions for either removing or replacing the terms. If you find a false positive result, mention it in a PR comment and include this text: #policheck-false-positive. This feedback helps reduce false positives in future scans.

✅ No issues found

More information about PoliCheck

Information: PoliCheck | Severity Guidance | Term
For any questions: Try searching the learn.microsoft.com contributor guides or post your question in the Learn support channel.

[learn-build-service-prod]

Learn Build status updates of commit 4912b56:

⚠️ Validation status: warnings

File	Status	Preview URL	Details
microsoft-edge/devtools/whats-new/2020/10/devtools.md	⚠️Warning	View	Details
microsoft-edge/devtools/css/flexbox.md	💡Suggestion	View	Details
microsoft-edge/devtools/elements-tool/elements-tool.md	💡Suggestion	n/a (file deleted or renamed)	Details
microsoft-edge/devtools/about-tools.md	✅Succeeded	View
microsoft-edge/devtools/console/console-dom-interaction.md	✅Succeeded	View
microsoft-edge/devtools/elements-tool/elements-tool-images/elements-tool.png	✅Succeeded	n/a (file deleted or renamed)
microsoft-edge/devtools/elements/elements-tool-images/elements-tool.png	✅Succeeded	View
microsoft-edge/devtools/elements/elements-tool.md	✅Succeeded	View
microsoft-edge/devtools/experimental-features/index.md	✅Succeeded	View
microsoft-edge/devtools/inspect-styles/edit-fonts.md	✅Succeeded	View
microsoft-edge/devtools/sources/index.md	✅Succeeded	View
microsoft-edge/devtools/whats-new/2020/03/devtools.md	✅Succeeded	View
microsoft-edge/devtools/whats-new/2020/05/devtools.md	✅Succeeded	View
microsoft-edge/devtools/whats-new/2020/08/devtools.md	✅Succeeded	View
microsoft-edge/devtools/whats-new/2020/11/devtools.md	✅Succeeded	View
microsoft-edge/devtools/whats-new/2021/01/devtools.md	✅Succeeded	View
microsoft-edge/devtools/whats-new/2021/02/devtools.md	✅Succeeded	View
microsoft-edge/devtools/whats-new/2021/04/devtools.md	✅Succeeded	View
microsoft-edge/devtools/whats-new/2021/05/devtools.md	✅Succeeded	View
microsoft-edge/devtools/whats-new/2021/10/devtools.md	✅Succeeded	View
microsoft-edge/toc.yml	✅Succeeded	View
microsoft-edge/visual-studio-code/microsoft-edge-devtools-extension.md	✅Succeeded	View
microsoft-edge/visual-studio-code/microsoft-edge-devtools-extension/opening-source-files-from-elements-tool.md	✅Succeeded	View

microsoft-edge/devtools/whats-new/2020/10/devtools.md

• Line 190, Column 3: [Warning: file-not-found - See documentation] Invalid file link: '../../../elements-tool/elements-tool.md'.

microsoft-edge/devtools/css/flexbox.md

• Line 0, Column 0: [Suggestion: filename-incomplete - See documentation] The filename contains an incomplete word, misspelled word, acronym, or abbreviation that is disallowed.

microsoft-edge/devtools/elements-tool/elements-tool.md

• [Suggestion: file-not-redirected - See documentation] File microsoft-edge/devtools/elements-tool/elements-tool.md with URL /microsoft-edge/devtools/elements-tool/elements-tool was deleted without redirection. To avoid broken links, add a redirection.

For more details, please refer to the build report.

Note: Your PR may contain errors or warnings or suggestions unrelated to the files you changed. This happens when external dependencies like GitHub alias, Microsoft alias, cross repo links are updated. Please use these instructions to resolve them.

[learn-build-service-prod]

PoliCheck Scan Report

The following report lists PoliCheck issues in PR files. Before you merge the PR, you must fix all severity-1 and severity-2 issues. The AI Review Details column lists suggestions for either removing or replacing the terms. If you find a false positive result, mention it in a PR comment and include this text: #policheck-false-positive. This feedback helps reduce false positives in future scans.

✅ No issues found

More information about PoliCheck

Information: PoliCheck | Severity Guidance | Term
For any questions: Try searching the learn.microsoft.com contributor guides or post your question in the Learn support channel.

[learn-build-service-prod]

Learn Build status updates of commit 904a8d9:

⚠️ Validation status: warnings

File	Status	Preview URL	Details
microsoft-edge/devtools/whats-new/2020/10/devtools.md	⚠️Warning	View	Details
microsoft-edge/devtools/css/flexbox-images/discover-flexbox.png	💡Suggestion	View	Details
microsoft-edge/devtools/css/flexbox.md	💡Suggestion	View	Details
microsoft-edge/devtools/elements-tool/elements-tool.md	💡Suggestion	n/a (file deleted or renamed)	Details
microsoft-edge/devtools/about-tools.md	✅Succeeded	View
microsoft-edge/devtools/console/console-dom-interaction.md	✅Succeeded	View
microsoft-edge/devtools/elements-tool/elements-tool-images/elements-tool.png	✅Succeeded	n/a (file deleted or renamed)
microsoft-edge/devtools/elements/elements-tool-images/elements-tool.png	✅Succeeded	View
microsoft-edge/devtools/elements/elements-tool.md	✅Succeeded	View
microsoft-edge/devtools/experimental-features/index.md	✅Succeeded	View
microsoft-edge/devtools/inspect-styles/edit-fonts.md	✅Succeeded	View
microsoft-edge/devtools/sources/index.md	✅Succeeded	View
microsoft-edge/devtools/whats-new/2020/03/devtools.md	✅Succeeded	View
microsoft-edge/devtools/whats-new/2020/05/devtools.md	✅Succeeded	View
microsoft-edge/devtools/whats-new/2020/08/devtools.md	✅Succeeded	View
microsoft-edge/devtools/whats-new/2020/11/devtools.md	✅Succeeded	View
microsoft-edge/devtools/whats-new/2021/01/devtools.md	✅Succeeded	View
microsoft-edge/devtools/whats-new/2021/02/devtools.md	✅Succeeded	View
microsoft-edge/devtools/whats-new/2021/04/devtools.md	✅Succeeded	View
microsoft-edge/devtools/whats-new/2021/05/devtools.md	✅Succeeded	View
microsoft-edge/devtools/whats-new/2021/10/devtools.md	✅Succeeded	View
microsoft-edge/toc.yml	✅Succeeded	View
microsoft-edge/visual-studio-code/microsoft-edge-devtools-extension.md	✅Succeeded	View
microsoft-edge/visual-studio-code/microsoft-edge-devtools-extension/opening-source-files-from-elements-tool.md	✅Succeeded	View

microsoft-edge/devtools/whats-new/2020/10/devtools.md

• Line 190, Column 3: [Warning: file-not-found - See documentation] Invalid file link: '../../../elements-tool/elements-tool.md'.

microsoft-edge/devtools/css/flexbox-images/discover-flexbox.png

• Line 0, Column 0: [Suggestion: image-name-incomplete - See documentation] The image name contains an incomplete word, misspelled word, acronym, or abbreviation that is disallowed.

microsoft-edge/devtools/css/flexbox.md

• Line 0, Column 0: [Suggestion: filename-incomplete - See documentation] The filename contains an incomplete word, misspelled word, acronym, or abbreviation that is disallowed.

microsoft-edge/devtools/elements-tool/elements-tool.md

• [Suggestion: file-not-redirected - See documentation] File microsoft-edge/devtools/elements-tool/elements-tool.md with URL /microsoft-edge/devtools/elements-tool/elements-tool was deleted without redirection. To avoid broken links, add a redirection.

For more details, please refer to the build report.

Note: Your PR may contain errors or warnings or suggestions unrelated to the files you changed. This happens when external dependencies like GitHub alias, Microsoft alias, cross repo links are updated. Please use these instructions to resolve them.