Rating Component Position Examples
Inline Position (Default)
This is a paragraph with an inline rating that doesn’t disrupt the text flow. The text continues right after the rating without breaking to a new line.
Left Position
This paragraph has a left-aligned rating. Notice how the text wraps around the rating rather than starting on a new line. This is useful for magazine-style layouts where you want the rating to stand out but still want text to flow naturally around it.
Right Position
This paragraph has a right-aligned rating. Similar to the left position, the text wraps around the rating. This position works well when you want to emphasize the rating at the end of a section or when you want to create a visual balance with other elements on the page.
Center Position
The center position takes up its own line and centers the rating. This is ideal for highlighting important ratings or when you want to create a clear visual separation between content sections.
Mixed Example
This is an example of how you might use a left-aligned rating at the beginning of a paragraph to immediately convey your opinion before the reader dives into your detailed thoughts. The small size makes it less intrusive.
Meanwhile, this paragraph has an inline rating in the middle of the text, which can be useful when you’re comparing multiple items within a single paragraph.
And finally, this paragraph shows how a right-aligned rating can serve as a visual conclusion to your thoughts, creating a nice bookend effect.