CSS-сниппеты

aligncenter.css

/* Вертикальное и горизонтальное выравнивание блока по центру */

.block-middle {
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  marign: auto;
}

customcheck.md

Кастомный чекбокс

html

Xорды
<input onclick="btnVisible()" type="checkbox" checked id="hordInput">
<label class="custom-check" for="hordInput"></label>

css

.custom-check{
	display: block;

	background-color: transparent;
	margin-top: 4px;
	width: 16px;
	height: 16px;
	border-radius: 45px;
	border: 2px solid #E91E63;
}

input[type="checkbox"]{
	display: none;
}

input[type="checkbox"]:checked + label {
	background-color: #E91E63;
}

fonts.css

/* Форматы веб-шрифтов и их подключение */

@font-face {
  font-family: 'Web Font';
  src:  url('webfont.eot');                                    /* IE9 Compat Modes */ 
        url('webfont.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ 
        url('webfont.woff2') format('woff2'),                  /* Новейшие браузеры */ 
        url('webfont.woff') format('woff'),                    /* Новые браузеры и IE9+ */ 
        url('webfont.ttf')  format('truetype'),                /* Старые Safari, Android, iOS */ 
        url('webfont.svg#svgFontName') format('svg');          /* Древние Safari, iOS, Android */ 
  font-weight: normal; 
  font-style: normal; 
}

remsize.css

/* Согласованный и предсказуемый размер в Rem (единица размера шрифта в css3) */

html { font-size: 62.5%; }
body { font-size: 1.4rem; margin: 2.6rem} /* =14px; =26px */
h1   { font-size: 2.4rem; padding: 1.2rem} /* =24px; =12px */

visuallyhidden.css

 /* Скрытие текста для ссылок с изображениями */

.visually-hidden {
  /* Удаляем элемент из потока документа */
  position: absolute;
  /* Временное решение для неверно произносимого, размазанного текста */
  white-space: nowrap;
  /* Устанавливаем минимально возможный размер (некоторые скринридеры игнорируют элементы с нулевой высотой и шириной) */
  width: 1px;
  height: 1px;
  /* Скрываем вылезающий за границы контент */
  overflow: hidden;
  /* Сбрасываем любые свойства, которые могут повлиять на размер элемента */
  border: 0;
  padding: 0;
  /* Вырезаем ту часть контента, которая должна отображаться. */
  /* Устаревшее свойство clip для старых браузеров */
  clip: rect(0 0 0 0);
  /* clip-path для новых браузеров. inset(50%) определяет область вставки, которая позволит контенту исчезнуть.  */
  clip-path: inset(50%); 
    /* Похоже, никто до конца не понимает, почему тут margin: -1px. Кроме того, это приводит к проблемам (читай: https://github.com/h5bp/html5-boilerplate/issues/1985). */
  margin: -1px;
}