5 Replies Latest reply on Nov 6, 2013 4:19 PM by resdesign

    How to centre the stage of 100% width in a browser?

    Eruditio

      I have created a web page in Edge that I intend to be centred in the web browser. If I keep the stage to fixed width (960 px) then I can centre it in the browser with the following in the compositionReady event of the Stage:

       

      $("#Stage").css("margin","auto");

       

      However, I want to create a tiled background, for which I use the following in the compositionReady event of the Stage:

       

      $("#Stage").css("background-image","url(images/diagmonds_@2X.png)","background-repeat","re peat");

       

      If I keep the stage to fixed width then I don't see the tiled background because the stage is full of objects and the tiled background doesn't extend past 0 and 960px. If I make the stage width 100% then everything becomes left-aligned, but I do see the tiled background (to the right of the stage objects).

       

      I've tried thinking of clever ways to position everything relative to some transparent element that has its width property set to 100%, but to no avail.

       

      Does anyone know of a way to ensure that everything positions relative to the centre of the stage while retaining the 100% width stage property?