根据切换屏幕窗口大小设置css

Question

我想在屏幕切换模式开启时根据内部屏幕大小设置条件css。

场景：

1. 默认情况下，左侧面板处于折叠状态，切换类处于活动状态span3和span9。
2. 点击Sidebar Toggle1后，课程span0和span12会被激活。

根据有效课程，我想通过应用课程display-inline

让按钮显示在另一个下面

我无法在折叠之前和折叠之后识别内部屏幕尺寸。有没有办法识别宽度？如果在这种情况下我可以使用媒体查询基于该宽度设置css。

$('#trig').on('click', function () {
    $('#colMain').toggleClass('span12 span9');
    $('#colPush').toggleClass('span0 span3');
});

小提琴链接here