div#happyfilter{margin:0 auto;grid-gap:10px 10px;display:grid;max-width:500px;justify-content:center;background-color:var(--color-gray,#f0f0f0);padding:10px;grid-template-columns:30% 30% 30%;grid-template-columns:repeat(3,minmax(0,1fr));box-sizing:border-box;label { text-align: right; padding: 6px; white-space: nowrap; overflow: hidden; } .een { grid-column-start: 1; } .twee { grid-column-end: span 2; } .vier { grid-column: span 3; } #sorteer { grid-column: 2 / span 2; } #happyfilter sub { font-size: .5em; }}@media screen and (min-width:800px){div#happyfilter{grid-template-columns:repeat(6,minmax(0,1fr));max-width:750px}}@media screen and (min-width:1200px){div#happyfilter{grid-template-columns:repeat(9,minmax(0,1fr));max-width:1150px}}@media print{div#happyfilter{display:none}}