Search Unity

Unwanted <style> in the gamecontainer div

Discussion in 'Web' started by Marc-Saubion, Sep 8, 2019.

  1. Marc-Saubion

    Marc-Saubion

    Joined:
    Jul 6, 2011
    Posts:
    655
    Hi everyone.

    I'm trying to display my WebGL app on my website using wordpress. I use an iframe showing my "index" page and this works great. My issue is making that index page filled with my WebGL app.

    I tried adding some css style to format it to my need but the result contains some additional style that I can't get rid of.

    Here is my html code for those who also want a clean full window display.

    Code (CSharp):
    1. <!DOCTYPE html>
    2. <html lang="en-us">
    3.   <head>
    4.   <style>
    5. * {
    6.   margin: 0;
    7.   padding: 0;
    8. }
    9.  
    10. mygameContainer {
    11.   width: 100%;
    12.   height: 100%;
    13.   position: absolute;
    14. }
    15.  
    16. canvas {
    17.   width: 100%;
    18.   height: 100%;
    19.   position: absolute;
    20. }
    21. </style>
    22.  
    23.     <meta charset="utf-8">
    24.     <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    25.     <title>Unity WebGL Player | WebGL</title>
    26.     <script src="Build/UnityLoader.js"></script>
    27.     <script>
    28.       var gameInstance = UnityLoader.instantiate("mygameContainer", "Build/WebGL-Innovatorium-demo.json");
    29.     </script>
    30.   </head>
    31.   <body>
    32.     <div id="mygameContainer"></div>
    33.   </body>
    34. </html>
    And here is what I get when I try to use my page.



    As you can see, my "mygameContainer " div, contains some "style" that override my initial choice. If you remove it using "inspect" in Chrome, the display is back to what I need.

    You can try it here: https://innovatorium.fr/WebGL-Innovatorium-demo/

    Does anybody knows how to get rid of this?

    Thanks
     
    Marc-Saubion, Sep 8, 2019
    #1

  2. Marc-Saubion

    Marc-Saubion

    Joined:
    Jul 6, 2011
    Posts:
    655
    Marc-Saubion, Sep 11, 2019
    #2