2012-06-08 47 views
0

的邊框使用Twitter的自舉-2.0.4Twitter的引導重疊項目

...some topbar code here.... 
div.container-fluid 
    div.content 
    div.row-fluid 
     div.span2 
     div.menuLeft 
      a(class='menuLeftItem', href="http://localhost:3000") Explore 
      br/ 
      a(class='menuLeftItem', href="http://localhost:3000") My Playlists 
      br/ 
      a(class='menuLeftItem', href="http://localhost:3000") Challenge 
      br/ 
      a(class='menuLeftItem', href="http://localhost:3000") Socialize 
      br/ 

我的CSS:

* { margin: 0; padding:0; } 

html, body { 
background-color: red; 
height: 100%; 
width: 100%; 
overflow: hidden; 
} 
body { 
    padding-top: 58px; /* 40px to make the container go all the way to the bottom of the topbar */ 
    padding-left: 0px; 
    padding-right: 0px; 
} 
.container-fluid { 
    background-color: black; 
} 
.content { 
    background-color: blue; 
} 
.span2 { 
    background-color: green; 
} 

.menuLeftItem { 
    color:white; 
    /*font*/ 
    font-size:13px; 
    font-weight:bold; 
    line-height:1; 
    border: 1px solid white; 
} 

我menuLeftItems沒有正確對齊。具體而言,這些元素的邊界重疊。請告訴我如何正確對齊元素。此外,我希望每個menuLeftItem都採用與其包含的元素span2相同的寬度。我爲.menuLeftItem嘗試了width = 100%。但它不會生效。

我的目標是爲不同的屏幕尺寸創建固定的頁面佈局。因此我試圖使用流體佈局。

任何幫助表示讚賞

+0

如何增加類menuLeftItem上面的元素「a」的寬度?沒有任何東西似乎生效。 –

回答