fancybox
fancybox copied to clipboard
Invalid HTML rendered by jquery.fancybox.js
The arrowLeft and arrowRight HTML created by the fancybox JS routine contains invalid HTML, as reported by https://validator.w3.org/#validate_by_input and other validators.
The issue is the DIV within the BUTTONs. DIVs are not allowed inside BUTTONs; the DIVs could be turned into SPANs and validate, however. Do the SVG elements need to be enclosed in DIVs at all here?
<button data-fancybox-prev class="fancybox-button fancybox-button--arrow_left" title="{{PREV}}">
<div>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M11.28 15.7l-1.34 1.37L5 12l4.94-5.07 1.34 1.38-2.68 2.72H19v1.94H8.6z"/></svg>
</div>
</button>
<button data-fancybox-next class="fancybox-button fancybox-button--arrow_right" title="{{NEXT}}">
<div>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M15.4 12.97l-2.68 2.72 1.34 1.38L19 12l-4.94-5.07-1.34 1.38 2.68 2.72H5v1.94z"/></svg>
</div>
</button>
Hi,
Thanks for reporting. While browsers do not seem to mind, this structure will be changed in the next update.