Skip to content

docs: document image/figure float and alignment#1

Closed
CybotTM wants to merge 1 commit intomainfrom
docs/image-float-alignment
Closed

docs: document image/figure float and alignment#1
CybotTM wants to merge 1 commit intomainfrom
docs/image-float-alignment

Conversation

@CybotTM
Copy link
Copy Markdown
Member

@CybotTM CybotTM commented Feb 12, 2026

Summary

  • Document the image/figure float and alignment feature from render-guides PR #1174
  • Add :class: and :align: to the optional parameters list with cross-references
  • Add new section covering CSS class approach (float-left/float-right), :align: option, clearing floats (rst-class:: clear-both), and responsive behavior
  • Include three live examples (Examples 8–10): figure float-left, figure align-right, image float-left with shadow
  • Add best practices for floating

Context

The render-guides 0.37.0 release will add CSS float/alignment support for images and figures. This PR adds the corresponding user documentation.

Test plan

  • Verify RST renders correctly (examples display floated images with wrapping text)
  • Check cross-references (:ref:image-float-alignment) resolve from the parameters list
  • Confirm example numbering continues correctly from existing Examples 1–7

@gemini-code-assist
Copy link
Copy Markdown

Summary of Changes

Hello @CybotTM, I'm Gemini Code Assist1! I'm currently reviewing this pull request and will post my feedback shortly. In the meantime, here's a summary to help you and other reviewers quickly get up to speed!

This pull request enhances the documentation for reStructuredText image and figure handling by introducing a new section that explains and demonstrates floating and alignment capabilities. It provides users with clear guidance on how to position images and figures within text flow using both CSS classes and the :align: option, ensuring that the documentation reflects the latest features available in render-guides.

Highlights

  • New Documentation Section: A comprehensive new section titled "Image and figure floating and alignment" has been added to document the recently introduced float and alignment support for images and figures in render-guides version 0.37.0.
  • Optional Parameters Updated: The list of optional parameters for images and figures now includes :class: for CSS classes (e.g., float-left, float-right) and :align: for figure alignment (left, right, center), both with cross-references to the new documentation.
  • Floating Mechanisms Explained: The documentation details two methods for applying floating: using CSS classes (:class: float-left/float-right) and the :align: option for figures, explaining their usage and equivalence.
  • Float Clearing and Responsiveness: Instructions for clearing floats using .. rst-class:: clear-both and a description of the responsive behavior of floated images on small screens have been included.
  • Practical Examples and Best Practices: Three new live examples (Examples 8-10) demonstrating different floating scenarios (figure float-left, figure align-right, image float-left with shadow) and a dedicated section on best practices for floating have been added.

🧠 New Feature in Public Preview: You can now enable Memory to help Gemini Code Assist learn from your team's feedback. This makes future code reviews more consistent and personalized to your project's style. Click here to enable Memory in your admin console.

Changelog
  • Documentation/Reference/ReStructuredText/Graphics/Images.rst
    • Updated the list of optional parameters to include :class: and :align: for image and figure styling and positioning.
    • Added a new section, "Image and figure floating and alignment," which explains how to float images and figures using CSS classes and the :align: option.
    • Included guidance on how to clear floats using .. rst-class:: clear-both and described the responsive behavior of floated images.
    • Provided three new examples (Examples 8-10) to illustrate floating and alignment in practice.
    • Appended a "Best practices for floating" section to offer recommendations for effective usage.
Activity
  • No specific activity (comments, reviews, progress updates) was provided in the context for this pull request.
Using Gemini Code Assist

The full guide for Gemini Code Assist can be found on our documentation page, here are some quick tips.

Invoking Gemini

You can request assistance from Gemini at any point by creating a comment using either /gemini <command> or @gemini-code-assist <command>. Below is a summary of the supported commands on the current page.

Feature Command Description
Code Review /gemini review Performs a code review for the current pull request in its current state.
Pull Request Summary /gemini summary Provides a summary of the current pull request in its current state.
Comment @gemini-code-assist Responds in comments when explicitly tagged, both in pull request comments and review comments.
Help /gemini help Displays a list of available commands.

Customization

To customize Gemini Code Assist for GitHub experience, repository maintainers can create a configuration file and/or provide a custom code review style guide (such as PEP-8 for Python) by creating and adding files to a .gemini/ folder in the base of the repository. Detailed instructions can be found here.

Limitations & Feedback

Gemini Code Assist may make mistakes. Please leave feedback on any instances where its feedback is incorrect or counter productive. You can react with 👍 and 👎 on @gemini-code-assist comments. If you're interested in giving your feedback about your experience with Gemini Code Assist for Github and other Google products, sign up here.

You can also get AI-powered code generation, chat, as well as code reviews directly in the IDE at no cost with the Gemini Code Assist IDE Extension.

Footnotes

  1. Review the Privacy Notices, Generative AI Prohibited Use Policy, Terms of Service, and learn how to configure Gemini Code Assist in GitHub here. Gemini can make mistakes, so double check it and use code with caution.

Copy link
Copy Markdown

@gemini-code-assist gemini-code-assist bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Code Review

This pull request adds comprehensive documentation for the new image and figure floating and alignment features. The new section is well-structured, with clear explanations and useful examples. My feedback focuses on improving the consistency of formatting for code literals within the reStructuredText file to ensure correct rendering and maintainability.

Copy link
Copy Markdown

Copilot AI left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

This PR documents the new image and figure floating and alignment feature that will be available in render-guides version 0.37.0. The documentation provides comprehensive guidance on how to use CSS float classes and the :align: option to position images alongside text.

Changes:

  • Added :class: and :align: parameters to the optional parameters list with cross-references to the new section
  • Created a comprehensive "Image and figure floating and alignment" section covering CSS classes, align option, clearing floats, and responsive behavior
  • Added three working examples (Examples 8-10) demonstrating figure float-left, figure align-right, and image float-left with shadow

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

Add documentation for the new CSS float and alignment support for images
and figures introduced in render-guides 0.37.0. Split the monolithic
Images.rst into three focused pages:

- Images.rst: basics, parameters, Examples 1-2
- ImageZoom.rst: zoom modes, options, accessibility, Examples 3-7
- ImageAlignment.rst: float/align, clearing, responsive, Examples 8-10

Depends on: TYPO3-Documentation/render-guides#1174
@CybotTM CybotTM force-pushed the docs/image-float-alignment branch from 5752e02 to d9f27c3 Compare February 12, 2026 21:16
@CybotTM CybotTM closed this Feb 12, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants