View Full Version : How to sandbox ExtJS within a larger app?

16 Sep 2011, 10:03 AM
We are using ExtJS as part of a larger application, and one fundamental class, x-border-box, is wreaking havoc on our content. How do I sandbox ExtJS within a page so this and other ExtJS classes are not applied to the html or body tags? This is really creating a big problem for us.

16 Sep 2011, 10:09 PM
Interesting question. I can see that Ext is pretty intrusive when it comes to CSS.

As far as I understand, the newly introduced sandboxing might help. It will still apply 'x4-border-box x4-quirks' to the html node and other CSS classes to the body. However, it seems that the CSS works somewhat different in sandboxing mode.

In a standard setup I can see the following rule being applied to the body:

.x-border-box .x-reset, .x-border-box .x-reset * {
box-sizing: border-box;
-moz-box-sizing: border-box;
-ms-box-sizing: border-box;
-webkit-box-sizing: border-box;

However, using Ext's sandboxing (ext-all-sandbox.js and ext-sandbox.css) does NOT have this rule applied to the body.