小编use*_*760的帖子

Bootstrap 导航栏：在较小的设备上不显示任何内容

中间带有徽标图像的导航栏在较大的屏幕上效果非常好，但在较小的屏幕上，所有内容都会消失，包括徽标图像（并且汉堡包无法显示）有人知道解决此问题的方法吗？

这是链接： http: //codepen.io/davidcochran/pen/Fkwys

#navbar-primary .navbar-nav {
  width: 100%;
  text-align: center;
}
#navbar-primary .navbar-nav > li {
  display: inline-block;
  float: none;
}
#navbar-primary .navbar-nav > li > a {
  padding-left: 30px;
  padding-right: 30px;
}

Run Code Online (Sandbox Code Playgroud)

<header role="banner">
<nav id="navbar-primary" class="navbar" role="navigation">
  <div class="container-fluid">
    <!-- Brand and toggle get grouped for better mobile display -->
    <div class="navbar-header">
      <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#navbar-primary-collapse">
        <span class="sr-only">Toggle navigation</span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
      </button>
    </div>
    <div class="collapse navbar-collapse" id="navbar-primary-collapse">
      <ul class="nav navbar-nav">
        <li class="active"><a …

Run Code Online (Sandbox Code Playgroud)

html css navbar twitter-bootstrap bootstrap-4

use*_*760

2017 02-26

6
推荐指数

1
解决办法

2964
查看次数