Compatibility old browser

[vuongc]

I wanted to use it on IE 10 but it wasn't working because it use flex attribute.

I overwrite the css classes if you are interested in using it in old browsers :).

.splitter-layout {
    position: absolute;

    display: -ms-flexbox;
    display: -webkit-box;
    display: -moz-box;
    display: -webkit-flex;
    display: flex;

    -ms-flex-direction: row;
    flex-direction: -webkit-row;
    flex-direction: -moz-row;
    flex-direction: row;

    width: 100%;
    height: 100%;
    overflow: hidden;
}

.splitter-layout .layout-pane {
    position: relative;

    -webkit-flex: 0 0 auto;
    -moz-flex: 0 0 auto;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;

    overflow: auto;
}

.splitter-layout .layout-pane.layout-pane-primary {
    -webkit-flex: 1 1 auto;
    -moz-flex: 1 1 auto;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
}

.splitter-layout>.layout-splitter {

    -webkit-flex: 0 0 auto;
    -moz-flex: 0 0 auto;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;

    width: 4px;
    height: 100%;
    cursor: col-resize;
    background-color: #ccc;
}

.splitter-layout .layout-splitter:hover {
    background-color: #bbb;
}

.splitter-layout.layout-changing {
    cursor: col-resize;
}

.splitter-layout.layout-changing>.layout-splitter {
    background-color: #aaa;
}

.splitter-layout.splitter-layout-vertical {
    -ms-flex-direction: column;
    flex-direction: -webkit-column;
    flex-direction: -moz-column;
    flex-direction: column;
}

.splitter-layout.splitter-layout-vertical.layout-changing {
    cursor: row-resize;
}

.splitter-layout.splitter-layout-vertical>.layout-splitter {
    width: 100%;
    height: 4px;
    cursor: row-resize;
}

[zesik]

Hi vuongc,

Thanks for contributing.

However, I don't have any plan of supporting old browsers now. Feel free to use customClassName to customize the CSS as your needs.