Semantic UI React  2.0.0
GitHub CHANGELOG
Getting Started
IntroductionGet StartedCompositionShorthand PropsThemingLayout examplesPrototypesMigration guide to v2
Elements
ButtonContainerDividerFlagHeaderIconImageInputLabelListLoaderPlaceholderRailRevealSegmentStep
Collections
BreadcrumbFormGridMenuMessageTable
Views
AdvertisementCardCommentFeedItemStatistic
Modules
AccordionCheckboxDimmerDropdownEmbedModalPopupProgressRatingSearchSidebarStickyTabTransition
Behaviors
Visibility
Addons
ConfirmPaginationPortalRadioRefSelectText AreaTransitionable Portal

Rail
A rail is used to show accompanying content outside the boundaries of the main view of a site.

src/elements/Rail/Rail.js
Semantic UI Rail Docs

Types

Rail

A rail can be presented on the left or right side of a container.

Try itCodeSandboxMaximizePermalink
Left Rail Content
Right Rail Content

Internal

A rail can attach itself to the inside of a container.

Try itCodeSandboxMaximizePermalink
Left Rail Content
Right Rail Content

Dividing

A rail can create a division between itself and a container.

Try itCodeSandboxMaximizePermalink
Left Rail Content
Right Rail Content

Variations

Attached

A rail can appear attached to the main viewport.

Try itCodeSandboxMaximizePermalink
Left Rail Content
Right Rail Content
Try itCodeSandboxMaximizePermalink
Left Rail Content
Right Rail Content

Close

A rail can appear closer to the main viewport.

Try itCodeSandboxMaximizePermalink
Left Rail Content
Right Rail Content
Try itCodeSandboxMaximizePermalink
Left Rail Content
Right Rail Content

Size

A rail can have different sizes.

Try itCodeSandboxMaximizePermalink
Mini Left Rail
Tiny Right Rail
Small Left Rail
Large Right Rail
Big Left Rail
Huge Right Rail
Massive Right Rail
This is the bottom
Blazing deployments by Vercel.