Previous technique
Next technique

Proper invisible labels

WCAG 2.2
A
#inputs#labels
<label for="name" class="sr-only">Enter your name:</label> <input id="name" type="text" />
.sr-only {
	border: 0 !important;
	clip: rect(1px, 1px, 1px, 1px) !important;
	-webkit-clip-path: inset(50%) !important;
	clip-path: inset(50%) !important;
	height: 1px !important;
	overflow: hidden !important;
	margin: -1px !important;
	padding: 0 !important;
	position: absolute !important;
	width: 1px !important;
	white-space: nowrap !important;
}

Learn more about the related success criteria: