Search code examples
salesforcevisualforcesalesforce-lightning

Why do Visualforce pages require invalid HTML? (at times)

This has happened to me a couple times. Using something like an <img> tag, or <br>. Basically any HTML void element. Just today I attempted to use a <br>, and when saving got this:

error message screen shot

Am I missing something?

Is there a reason for this?

Are void elements not intended for use in visualforce pages or components?

Or is this just flawed syntax checking?

Can be very frustrating at times, I ended up adding a false tag the other day because I realized it wouldn't be rendered and it was the only way to save my page...

P.S. I'm sorry if this has an easily accessible answer. I think I looked a reasonable amount, but not as much as usual before posting a question. Just couldn't even find search terms to get me close to something relevant.

Solution

  • Visualforce must be a valid XML document. Not HTML (which permits <img> without closing), not XHTML (because if you add any <apex:... tags not defined by W3C officially it's not a html document anymore, at least until it gets compiled and output becomes pure html0.

    So you need <img> ... </img> or self-closing version, <img />. In a way Lightning Web Components are even worse, self-closing doesn't work. Has to be explicit "end tag".

    As to why... probably for easier ability to parse it as a valid document? I suspect they did it also for easier PDF generation.

    This isn't exactly same topic but close enough I could find in reasonable time: https://developer.salesforce.com/docs/atlas.en-us.pages.meta/pages/pages_styling_doctype.htm