2 Replies Latest reply on Dec 1, 2012 4:42 AM by horuscat

    Adaptive Layouts - Getting ALL layouts (400,600,800,1200) to center in browser window?

    horuscat

      I'm using the Adaptive Layouts from EdgeCommons.

       

      I've added the code: $("#Stage").css("margin","auto"); to 'compositionReady', and my full size layout (1200) centers perfectly in the browser.

       

      But when you resize the browser window, the stage goes back to left alignment in the other layouts (800,600,400)... I would like each layout to stay centered until it 'jumps' down to the next layout size when the window is resizing. the '1200' layout does this perfectly.

       

      I tried adding the same code: $("#Stage").css("margin","auto"); to 'resize' after the adaptiveContainer code, but that didn't do it...

       

      Am I missing something? Something simple hopefully? ;-)

       

       

      Any help would be greatly appreciated!

       

      Thanks!

      Craig

        • 1. Re: Adaptive Layouts - Getting ALL layouts (400,600,800,1200) to center in browser window?
          heathrowe Most Valuable Participant

          Hi Craig, are you sure there is nothing else in you code (elsewhere) or property setting that overrides the $("#Stage").css("margin","auto");

           

          I just did a simple test using your sample code, on compositionReady and it worked as expected on browser resize.

           

          Is there a particular Browser (and version) that you are seeing this sympom?

           

          Darrell

          • 2. Re: Adaptive Layouts - Getting ALL layouts (400,600,800,1200) to center in browser window?
            horuscat Level 1

            Hey Darrell!

             

            Thanks for the response...

             

            I'm fairly certain I don't have any conflicting code, since I've only added the adaptive layout code so far.. and then the css for the Stage. But I am just learning Edge Animate, so I'm sure I could be missing some kind of setting. The vid tutorial on EdgeCommons didn't go into much detail.

             

            Here's a sample page...  http://mysticdaddy.net/home13.html .

             

            If you view it at full size (1200) it's doing exactly what I want.. floating centered in the browser window as you resize the window. But no matter how many tweaks I do to the other layouts, I can't seem to get them to follow suit and float centered...

             

            As far as versions go.. I'm on OS 10.6.8 and the same thing is happening in Safari (5.1.7), Chrome (23.0.1271.95), and Firefox (17.0), so I know it's inside Edge Animate.

             

            Any thoughts.. suggestions?

             

            Thanks!

            Craig