Making WordPress.org

Opened 16 months ago

Last modified 8 months ago

#6926 new defect (bug)

Paragraph and Image are aligned inline

Reported by: patelhitesh's profile patelhitesh Owned by:
Milestone: Priority: low
Component: HelpHub (wordpress.org/documentation) Keywords: needs-patch needs-design-feedback has-screenshots
Cc:

Description

Please check the below URL:
https://wordpress.org/documentation/article/gallery-block/

When we inspect the page and check the page width 425px wide the paragraph and image are aligned inline-block instead of block.

For more details, please check the attached screenshot

Attachments (1)

CleanShot 2023-04-07 at 15.07.55@2x.png (223.1 KB) - added by patelhitesh 16 months ago.
Paragraph and image are aligned inline

Download all attachments as: .zip

Change History (3)

@patelhitesh
16 months ago

Paragraph and image are aligned inline

#1 @patelhitesh
16 months ago

To overcome the issue, please find the below CSS:

body .is-layout-constrained > .alignright { float: none; }

#2 @coffee2code
8 months ago

  • Component changed from WordPress.org Site to HelpHub (wordpress.org/documentation)
  • Priority changed from normal to low

Just to rephrase what seems to be reported: right-floated images (of which there are currently at least 3 on the page) continue to remain right-floated at narrower viewports. At these narrower viewports, the paragraphs to the left of any of these images will become increasingly narrower themselves to the detriment of readability. I believe the ticket reporter is choosing 425px arbitrarily as a good place to make the right-floated images behave as blocks/non-floated and not that there's anything special about that width, which is reasonable (definitely below 400px it is an issue).

FYI: The theme for the documentation site is hosted on GitHub at https://github.com/WordPress/wporg-documentation-2022.

Note: See TracTickets for help on using tickets.