【问题标题】:Twitter Bootstrap grid logo and nav bar same row with nav aligned to bottom of rowTwitter Bootstrap 网格徽标和导航栏与导航对齐到行底部的同一行
【发布时间】:2013-02-12 16:13:58
【问题描述】:

我试图在引导导航菜单的左侧放置一个圆形徽标,并使菜单与行的底部对齐,但它总是希望与顶部对齐。我用玉写了这个,但希望其他语言的人至少可以理解它是如何工作的(缩进表示嵌套而不是结束标记)。有没有办法我可以轻松地使用 css 或在引导程序中使用网格系统来做到这一点?

doctype 5
html
    head
    title= title
    link(rel='stylesheet', href='/css/bootstrap.min.css')
    link(rel='stylesheet', href='/stylesheets/style.css')

    body
        .container
            .row

                .span3
                    img(id='add-razaoSocial', src='KSUB_PLATTER_Full.png', width=100)
                .row

                        .span9
                            .navbar(class="pull-left")
                                    .navbar-inner
                                        a(class='brand')
                                        ul(class="nav nav-tabs")
                                            li 
                                                a(href='#') About
                                            li 
                                                a(href='#') Schedule
                                            li 
                                                a(href='#') Events
                                            li 
                                                a(href='#') Gallery
            block content
            script(src='http://code.jquery.com/jquery.js')
            script(src='/js/bootstrap.min.js')

【问题讨论】:

    标签: html node.js twitter-bootstrap express pug


    【解决方案1】:

    我认为问题来自于在导航栏内创建你想要的标签(以及在 navbar-inner 内,它包裹你的标签)。您尝试实现的选项卡不需要包裹在导航栏内(设计得非常好,可以固定/静态到顶部或底部)。请参阅他们的导航标签文档http://twitter.github.com/bootstrap/components.html#navs

    独立的<ul class="nav nav-tabs"> 应该更容易包装和设置边距/填充。还可以将图像下方行的 CSS 位置属性设置为绝对值。和内容相关。

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 2014-02-09
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2012-04-11
      • 1970-01-01
      相关资源
      最近更新 更多