Platform: don't hardcode ID in {Emscripten,Sdl}App::setContainerCssClass().

Instead look for a closest parent element of our <canvas> having the
.mn-container class. This should thus work for more than one canvas on a
page.

src/Magnum/Platform/EmscriptenApplication.cpp

@@ -402,7 +402,13 @@ void EmscriptenApplication::setWindowTitle(const std::string& title) {
 void EmscriptenApplication::setContainerCssClass(const std::string& cssClass) {
     #pragma GCC diagnostic push
     #pragma GCC diagnostic ignored "-Wdollar-in-identifier-extension"
-    EM_ASM_({document.getElementById('container').className = AsciiToString($0);}, cssClass.data());
+    EM_ASM_({
+        /* Handle also the classic #container for backwards compatibility. We
+           also need to preserve the mn-container otherwise next time we'd have
+           no way to look for it anymore. */
+        (Module['canvas'].closest('.mn-container') ||
+         document.getElementById('container')).className = (['mn-container', AsciiToString($0)]).join(' ');
+    }, cssClass.data());
     #pragma GCC diagnostic pop
 
     /* Trigger a potential viewport event -- we don't poll the canvas size like

src/Magnum/Platform/EmscriptenApplication.h

@@ -517,12 +517,21 @@ class EmscriptenApplication {
         /**
          * @brief Set container CSS class
          *
-         * Assigns given CSS class to the @cb{.html} <div id="container"> @ce.
-         * Useful for example to change aspect ratio of the view or stretch it
-         * to cover the full page. See @ref platforms-html5-layout for more
-         * information about possible values. Note that this replaces any
-         * existing class, to set multiple classes separate them with
-         * whitespace.
+         * Assigns given CSS class to the @cb{.html} <div class="mn-container"> @ce
+         * enclosing the application @cb{.html} <canvas> @ce. Useful for
+         * example to change aspect ratio of the view or stretch it to cover
+         * the full page. See @ref platforms-html5-layout for more information
+         * about possible values. Note that this replaces any existing class
+         * (except for @cb{.css} .mn-container @ce, which is kept), to set
+         * multiple classes separate them with whitespace.
+         *
+         * @m_class{m-note m-danger}
+         *
+         * @par
+         *      For backwards compatibility purposes the function will look for
+         *      *any* @cb{.html} <div id="container"> @ce in case the
+         *      @cb{.html} <div class="mn-container"> @ce is not found. This
+         *      compatibility is scheduled to be removed in the future.
          */
         void setContainerCssClass(const std::string& cssClass);
 

src/Magnum/Platform/Sdl2Application.cpp

@@ -733,7 +733,13 @@ Vector2i Sdl2Application::framebufferSize() const {
 void Sdl2Application::setContainerCssClass(const std::string& cssClass) {
     #pragma GCC diagnostic push
     #pragma GCC diagnostic ignored "-Wdollar-in-identifier-extension"
-    EM_ASM_({document.getElementById('container').className = AsciiToString($0);}, cssClass.data());
+    EM_ASM_({
+        /* Handle also the classic #container for backwards compatibility. We
+           also need to preserve the mn-container otherwise next time we'd have
+           no way to look for it anymore. */
+        (Module['canvas'].closest('.mn-container') ||
+         document.getElementById('container')).className = (['mn-container', AsciiToString($0)]).join(' ');
+    }, cssClass.data());
     #pragma GCC diagnostic pop
 }
 #endif

src/Magnum/Platform/Sdl2Application.h

@@ -797,14 +797,23 @@ class Sdl2Application {
         /**
          * @brief Set container CSS class
          *
-         * Assigns given CSS class to the @cb{.html} <div id="container"> @ce.
-         * Useful for example to change aspect ratio of the view or stretch it
-         * to cover the full page. See @ref platforms-html5-layout for more
-         * information about possible values. Note that this replaces any
-         * existing class, to set multiple classes separate them with
-         * whitespace.
+         * Assigns given CSS class to the @cb{.html} <div class="mn-container"> @ce
+         * enclosing the application @cb{.html} <canvas> @ce. Useful for
+         * example to change aspect ratio of the view or stretch it to cover
+         * the full page. See @ref platforms-html5-layout for more information
+         * about possible values. Note that this replaces any existing class
+         * (except for @cb{.css} .mn-container @ce, which is kept), to set
+         * multiple classes separate them with whitespace.
          *
          * @note Only available on @ref CORRADE_TARGET_EMSCRIPTEN "Emscripten".
+         *
+         * @m_class{m-note m-danger}
+         *
+         * @par
+         *      For backwards compatibility purposes the function will look for
+         *      *any* @cb{.html} <div id="container"> @ce in case the
+         *      @cb{.html} <div class="mn-container"> @ce is not found. This
+         *      compatibility is scheduled to be removed in the future.
          */
         void setContainerCssClass(const std::string& cssClass);
         #endif