`<button>
<svg aria-hidden="true" class"toggle"> </svg>
<span class="visually-hidden"> SubNavigation Item 1</span>
</button>`
wobei: a) .visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; width: 1px; margin: -1px; padding: 0; overflow: hidden; position: absolute; }
Habs jetzt kapiert!
und b)
die klasse
svg.toggle+[aria-expanded]::before { content: 'path/to/times.svg'; font-family: 'Font Awesome 5 Pro'; src: local('Font Awesome 5 Pro'); width: 1em; } <<<< also das X
svg.toggle+[aria-expanded="false"]::before { content: 'path/to/bars.svg'; font-family: 'Font Awesome 5 Pro'; src: local('Font Awesome 5 Pro'); width: 1em; } <<<< also SANDWICH
ginge das nicht in der art?