patternfly / patternfly/patternfly-org

Images are presented inconsistently in docs

Open
#4,827 5 comments 0 reactions 1 assignee View on GitHub

@edonehoo is already working on this.

Since Jan 15, 2026.

PF Team
Dominant language
JavaScript
Stars
74
Forks
147
Avg merge
4d 11h
Merged PRs (30d)
2

Description

Curious if we could normalize any of these. I'll also say that on top of these, there are a lot of images in the docs that are not within any kind of class/wrapper - so those are either left-aligned with the content if they're less than the width of the content wrapper, or they consume 100% of the content width with no max-width.

.ws-docs-content-img

https://github.com/patternfly/patternfly-org/blob/b455d81018a53a3986a2dca9f12628d179fe8f7e/packages/documentation-site/patternfly-docs/content/design-guidelines/components/components.css#L1-L6

.ws-image

  • centers its child horizontally

  • same as above but will grow to 100% of the available width instead of a max of 700px

https://github.com/patternfly/patternfly-org/blob/b455d81018a53a3986a2dca9f12628d179fe8f7e/packages/documentation-framework/templates/mdx.css#L19-L21

.ws-images

  • centers itself horizontally

  • has a max-width of 600px

  • Same as the first one except 600px instead of 700px and it will not center its children, so if an image less than 600px wide is passed, it will be left aligned within the container.

https://github.com/patternfly/patternfly-org/blob/b455d81018a53a3986a2dca9f12628d179fe8f7e/packages/site/src/content/get-started/get-started.css#L5-L8


Jira Issue: PF-2788

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.