在最小化窗口中内联显示侧面板

Question

我需要使Web应用程序中的侧面板响应更快。我已经在Google上搜索了帮助，但没有回答我的问题。我的网站上有一个侧面板，其中的内容以完整的桌面显示形式堆叠（我想要）。但是在将其最小化的过程中，它们却始终堆叠在一起，我希望它改为改为内联。请参阅我的图片，以获取我想要实现的视觉示例。

根据需要，它在桌面模式下的外观。

在最小化窗口时，我不希望它是：

我想要的样子：

Answer 1

使用媒体查询来定位要在其内联并且将display:inline-block设置为元素的视图。

JSFiddle

例如：

.stack_nav{
  padding:0;
  margin:0;
  list-style: none;
}
.stack_nav>li{
  padding: 10px;
  display:block;
}

@media (max-width: 767px){
  .stack_nav>li{
     display: inline-block; 
  }  
}