1

I have the following HTML style tag

<style>
    #loginBackground {
        background-image: url(https://somedomain.com/services/storage?id=89174&amp;type=picture&amp;secret=ucWEYqzpQk8QCaHHp3lfDy5vRrISWwUgzGLnWaDD&amp;timestamp=1478862301);
        background-size: cover;
        background-position: center center;
    }
</style>

Chrome queries this url: https://somedomain.com/services/storage?id=89174&amp;type=picture&amp;secret=ucWEYqzpQk8QCaHHp3lfDy5vRrISWwUgzGLnWaDD&amp;timestamp=1478862301 without turning &amp; in & so the image is not displayed correctly.

Document doctype is <!DOCTYPE html> so HTML 5.

Everything works fine if I don't encode these ampersands but according to this thread what's the de facto practice on ampersand encoding in html all ampersands must be encoded.

I've tried to use &#38; instead of &amp;, using double or single quotes around the url but nothing works.

Is this a browser bug or in this case ampersand should not be encoded?

syl.fabre
  • 696
  • 1
  • 7
  • 20

1 Answers1

4

<style> (and <script>) elements are defined (in HTML 4 terms) as containing CDATA. (HTML 5 says the same thing, but not as clearly).

This means that the normal rules for markup do not apply and entities are not expanded.

If you want an ampersand character inside a <style> element then you must use a literal ampersand.

Quentin
  • 914,110
  • 126
  • 1,211
  • 1,335
  • @arkascha — The OP *observed* that and asked if it was a browser bug or if it shouldn't be encoded. This answer clearly says that it is the behaviour defined in the HTML spec. – Quentin Nov 12 '16 at 09:48