Center Bootstrap导航栏标题

时间:2017-04-19 13:44:38

标签: html css twitter-bootstrap

我正在寻找处理我的[[2,3], [8,3,2], [2,10,1], [2,2,2,2]] -> [6,48,20,16] 并且我无法克服我的标签。

这部分的脚本如下:

listOfProductInt :: [[Int]] -> [Int]
listOfProductInt [] = []
listOfProductInt lists = foldl (\y x-> multipleInts x concat) [] lists

multipleInts :: (Num a) => [a] -> a
multipleInts list1 = foldl (\y x -> y * x) 1 list1

我想集中注意力:Bootstrap navbar title

enter image description here

我已经阅读了这篇文章:Center content in responsive bootstrap navbar

但我找不到想要的方法:/

我认为这并不难,但到目前为止并不成功。

谢谢

7 个答案:

答案 0 :(得分:4)

编辑:它应与this fiddle

一起使用
.navbar.navbar-inverse .navbar-header .navbar-brand {
        display: block;
        text-align:center;
        float: none;
        vertical-align: top;
}

.navbar.navbar-inverse .navbar-header{
  float: none; 
}

答案 1 :(得分:1)

从您的css text-align: center;中取出.navbar.navbar-inverse.navbar-header.navbar-brand {..}并将其移至

.navbar-header {
  text-align: center;
}

会解决它。



.navbar.navbar-inverse.navbar-header.navbar-brand {
  display: inline-block;
  float: none;
  vertical-align: top;
}

.navbar-header {
  text-align: center;
}

.bg-red {
  background-color: red;
}

.bg-yellow {
  background-color: yellow;
}

<!-- #################### -->
<!-- Upper navigation bar -->
<!-- #################### -->
<div class="wraper">
  <nav class="navbar navbar-inverse">
    <div class="container-fluid">
      <div class="row">
        <div class="col-md-12">
          <div class="navbar-header bg-yellow">
            <a class="navbar-brand bg-red"> Choix du logiciel </a>
          </div>
        </div>
      </div>
    </div>
  </nav>
</div>
&#13;
&#13;
&#13;

答案 2 :(得分:1)

使用此css:

theList

答案 3 :(得分:1)

将内联块更改为仅阻止。

class ToggleImage {
  constructor() {
    this.thumbnail = $('#gallery img')
    this.modalImage = $('.modal__image')
    this.passHref()
    this.event()   // added
  }

  event() {
    this.thumbnail.click(this.passHref)
  }

  passHref() {
     // some code other than $(e.target)...
  }  
}

答案 4 :(得分:0)

添加display:inline-block到.navbar-brand可能会修复它。 还有text-align:center到.navbar-header

答案 5 :(得分:0)

检查并查看

.navbar.navbar-inverse .navbar-header .navbar-brand {
        display: block;
        text-align: center;
        float: none;
        vertical-align: top;
      }

答案 6 :(得分:-1)

将text-align:center放在.navbar-header上。它必须工作。

您的标签必须是显示屏,因此标签内的文字可以居中。

您也可以在标签上放置display:block。