Skip to content

A skip to content component allows screen reader and keyboard users to bypass navigation rather than tabbing through it.

Examples

*required
Name	Type	Default	Description
hrefrequired	string		The skip to content link.
children	React.ReactNode	null	Content to display within the skip to content component, typically a string.
className	string	''	Additional styles to apply to the skip to content component.

Expand or collapse column	Selector	Variable	Value
	.pf-v5-c-skip-to-content	--pf-v5-c-skip-to-content--Top	1rem
--pf-v5-c-skip-to-content--Top --pf-v5-global--spacer--md $pf-v5-global--spacer--md pf-size-prem(16px) 1rem
	.pf-v5-c-skip-to-content	--pf-v5-c-skip-to-content--ZIndex	600
--pf-v5-c-skip-to-content--ZIndex --pf-v5-global--ZIndex--2xl $pf-v5-global--ZIndex--2xl 600
	.pf-v5-c-skip-to-content	--pf-v5-c-skip-to-content--focus--Left	1rem
--pf-v5-c-skip-to-content--focus--Left --pf-v5-global--spacer--md $pf-v5-global--spacer--md pf-size-prem(16px) 1rem