带引导的CSS样式

我试图在Bootstrap-sass环境中创建一个静态顶部条。问题：固定顶杆并保持响应。我已阅读关于继承和嵌套规则的CSS文档，但仍不确定如何应用于此案例。带引导的CSS样式

现在，我的顶部栏固定在顶部，但它没有响应。

CSS

.fixed_pos { 
    position: fixed; 
} 

.flowing_body { 
    margin-top: 100px; 
}

引导CSS

// Reset utility classes due to specificity 
[class*="span"].hide, 
.row-fluid [class*="span"].hide { 
    display: none; 
} 

[class*="span"].pull-right, 
.row-fluid [class*="span"].pull-right { 
    float: right; 
}

HTML

<div class="container-fluid"> 
    <div class="fixed_pos row-fluid"> 
     <div class="span9">//left long side of top bar</div> 
     <div class="span3">//right long side of top bar</div> 
    </div> 
    <div class="row fluid flowing_body"> 
     <%= yield %> 
    </div> 
</div>

这是我尝试添加日Ë响应特性： CSS

.row-fluid .fixed_pos { 
    position: fixed; 
}

HTML

<div class="row-fluid"><!-- MENUS --> 
    <div class="fixed_pos"> 
    //everything else the same 
    </div> 
</div>

但随后的顶栏的尺寸缩小，仍然没有反应。

我感谢任何帮助。这里有一个很好的参考，我尝试自己解决，但还没有成功：Link

来源

2012-12-10 Maximus S

这是我如何解决了这个问题：

CSS

.row-fluid .fixed_pos { 
    position: fixed; 
    width: 80%; 
}

查看

<div class="container-fluid"> 
    <!-- TOP BAR, FIXED --> 
    <div class="row-fluid"> 
     <div class="fixed_pos"> 
     <!-- MENUS --> 
      <div class="span12"> 
       <ul class="nav nav-tabs"> 
</appropriate endings..>

最后，顶部酒吧是固定和响应。

来源

2012-12-11 06:09:14

Add this code in bootstrap-responsive.css 

@media (max-width: 979px){ 
.navbar-fixed-top, .navbar-fixed-bottom {position: fixed;} 
.container-fluid{ margin-top:70px;} 
}

来源

2012-12-10 05:57:27 Murali

谢谢，但它不能解决问题。当我在导航栏上方放置排液时，顶部导航栏的宽度似乎会缩小。 –

带引导的CSS样式

回答

相关问题