如何在调整大小时始终显示导航栏的元素？

Question

我有一个包含div的导航栏，当我调整窗口大小时，我需要像instagram.com那样做;内部元素始终可见。

CSS中是否有某种策略可以做同样的事情？

CSS：

.navbar {
   position: fixed;
   background-color: #039D6E;
   width:100%;
   height: 55px;
   white-space: nowrap;
}


.subNav{ /* Inside Div of the navbar that always need to be visible */
  height:55px;
  width:auto;
  display: inline-block;
  position: relative;
  left:25%;
  white-space:nowrap;
  padding: 12px;
}

Answer 1

只需给.subNav一个固定的宽度，例如width: 150px;。

请参阅下面的测试小提琴：

.navbar {
   position: fixed;
   background-color: #039D6E;
   width:100%;
   height: 55px;
   white-space: nowrap;
   padding: 0px;
   margin: 0px;
}


.subNav{ /* Inside Div of the navbar that always need to be visible */
  height: 51px;
  width: 150px;
  resize:none;
  border: 2px solid red;
  position: relative;
  left:25%;
  white-space:nowrap;
  //padding: 12px;
  margin: 0px;
}

<div class="navbar">
<div class="subNav">
</div>
</div>