Javascript 在smaler屏幕上，无论发生什么情况，滑出标签都应该贴在Div的左侧

我正在构建这个滑出过滤器div。该div默认位于较大屏幕的右侧，但当屏幕尺寸缩小时，会隐藏侧边栏并显示.SlideOutTab

在768px和992px之间。滑出带面滑座的行为不符合预期

两个潜水艇都漂浮着

我已经在媒体查询中加入了CSS，用于768px和992px之间的空间，但这并没有改变正在发生的事情

这是一个

有人能帮我吗

$document.readyfunction{ $'.slideOutTab'.onclick，函数{ $facetsSlide.toggleClass'show'； $'.slideOutTab'.toggleClass'showSlideOut'； } ; }; /*显示滑出*/ .内容{ 背景：灰色； 最小高度：100vh； 顺序：2；} 滑面{ 宽度：300px； 背景：fff； 位置：绝对位置； 右：0px；} facetsSlide.show{ 转化：继承； 显示：块； 背景：fff；} .显示滑出{ 右：300px！重要；} .custom control.ls复选框：悬停{ 光标：指针； 背景色：f9f9f9；} .custom-control.ls-checkbox.物料控制输入{ 显示：无；} .custom-control.ls-checkbox.物料控制输入：勾选~.物料控制指示符{ 边框颜色：c2002d； 变换：旋转45度平移1px，-5px； 宽度：10px； 边框顶部：0px实心fff； 左边框：0px实心fff；} .custom-control.ls-checkbox.物料控制指示器{ 显示：内联块； 位置：绝对位置； 顶部：4px； 左：0； 宽度：16px； 高度：16px； 边框：2px实心bab9b9； 转换：.3s；} /*标签*/ .滑出{ 光标：指针； z指数：1000； /*利润上限：-300px*/ 边际上限：0px； 位置：绝对位置； /*左：-40px*/ 右：0px； 高度：200px； 宽度：40px； -webkit盒阴影：0 1px 5px rgba0,0,0,0.5； 盒影：0 1px 1px rgba0,0,0,0.5； 背景：fff； 边界半径：1px 0px 0px 1px； 边框：1px实心bab9b9；} .滑出B分区{ 文本对齐：居中； 位置：相对位置； 右：70px； 顶部：90px； 颜色：c2002d； 宽度：180px； -webkit变换：旋转270度； -莫兹变换：旋转270度； -o变换：旋转270度； 写入模式：lr tb；} @介质最大宽度：1199.98px{ 滑面{ 显示：无； 转换：translateX-100%；} @媒体最小宽度：992px{ .滑出{ 显示：无；}} 搜索结果 过滤块1： 15054 过滤器1 2165 过滤器2 2364 过滤器3 475 过滤器4 215 过滤器5 过滤块2 29 1819-1828 77 1829-1838 260 1839-1848 1103 1849-1858 1574 1859-1868 2541 1869-1878 4550 1879-1888 10232 1889-1898 18155 1899-1908 29341 1909-1918 36170 1919-1928 49566 1929-1938 60152 1939-1948 82785 1949-1958 111613 1959-1968 125677 1969-1978 166842 1979-1988 176976 1989-1998 149340 1999-2008 110611 2009-2018 917 2019 过滤搜索

---

问题1，两个区块正在分离或漂浮，因为 其中,

/* In grid.scss file */
@media (min-width: 768px) {
.col-md-3 {
    max-width: 25%;
    }
}

解决方案是用您想要的宽度覆盖它

#facetsSlide {
  max-width: 300px;
}

问题2和3，右侧过滤器块没有出现，因为没有为其提供媒体查询，并且我删除了一个不必要的属性

@media (max-width: 1199.98px) {
  #facetsSlide {
    /*transform: translateX(-100%); removed */ } 
}
@media (min-width: 992px) { /* Added query */
   #facetsSlide {
     display: block;
   }
}

---

这是一把小提琴。我希望这是预期的结果。如果没有，请在下面发表评论。

非常感谢您，这看起来像是我想要达到的目标。