Template:Chset-legend/sandbox/style.css

.chset_legend dl {
	margin: 0;
	display: grid;
	grid: auto-flow / auto 1fr;
	align-items: center;
}
.chset_legend dt {
	margin: 0;
	font-weight: unset;
}
.chset_legend dd {
	margin: 0;
	display: inline;
}
.chset_legend dd::before {
	content: " ";
	white-space: pre;
}
.chset_legend dt span {
	margin: 1px 0;
	display: inline-block;
	border: 1px solid black;
	color: black;
}
.chset_legend dt span.type-alpha {
	background-color: #E7FFE7;
}
.chset_legend dt span.type-cntrl {
	background-color: #FFFFEF;
}
.chset_legend dt span.type-digit {
	background-color: #F7E7FF;
}
.chset_legend dt span.type-punct {
	background-color: #DFF7FF;
}
.chset_legend dt span.type-extsym {
	background-color: #DFDFE7;
}
.chset_legend dt span.type-graph {
	background-color: #FFEFAF;
}
.chset_legend dt span.type-intl {
	background-color: #FFEFDF;
}
.chset_legend dt span.type-undef {
	background-color: #D0D0D0;
}
.chset_legend dt span::after {
	content: " ";
	white-space: pre;
	display: inline-block;
	width: 0.1em;
	height: 0;
	border-right: 1.5em solid;
	border-bottom: 1.51em solid;
}
.chset_legend dt span.type-alpha::after {
	border-right-color: #D7FFD7;
	border-bottom-color: #E7FFE7;
}
.chset_legend dt span.type-cntrl::after {
	border-right-color: #FFFFE0;
	border-bottom-color: #E7FFE7;
}
.chset_legend dt span.type-digit::after {
	border-right-color: #F0D7FF;
	border-bottom-color: #F7E7FF;
}
.chset_legend dt span.type-punct::after {
	border-right-color: #D0F0FF;
	border-bottom-color: #DFF7FF;
}
.chset_legend dt span.type-extsym::after {
	border-right-color: #D0D0D7;
	border-bottom-color: #DFDFE7;
}
.chset_legend dt span.type-graph::after {
	border-right-color: #FFE7A0;
	border-bottom-color: #FFEFAF;
}
.chset_legend dt span.type-intl::after {
	border-right-color: #FFE7D7;
	border-bottom-color: #FFEFDF;
}
.chset_legend dt span.type-undef::after {
	border-right-color: #C0C0C0;
	border-bottom-color: #D0D0D0;
}

/* [[カテゴリ:テンプレートスタイル|Chset-legend/sandbox]] */