JoeNoPhoto/hideElementMixin.scss

Created October 14, 2015 07:15

Star () You must be signed in to star a gist
Fork () You must be signed in to fork a gist

Learn more about clone URLs
Clone this repository at <script src="https://gist.github.com/JoeNoPhoto/56ce11a2664ac198051c.js"></script>
Save JoeNoPhoto/56ce11a2664ac198051c to your computer and use it in GitHub Desktop.

Download ZIP

Hide Element Mixin

Raw

hideElementMixin.scss

	%visuallyhidden {
	margin: -1px;
	padding: 0;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	clip: rect(0, 0, 0, 0);
	position: absolute;
	}

Author

JoeNoPhoto commented Oct 14, 2015

Usage

<button class="mobile-navigation-trigger">
  <b class="visually-hidden">Open the navigation</b>
  <img src="img/mobile-navigation-icon.svg">
</button>

.visually-hidden {
  @extend %visuallyhidden;
}

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment