Twitter Bootstrap Xóa Lề của Span

Question

Tôi đang sử dụng Twitter Bootstrap. Và tôi đã sử dụng span8 và span 4 liên tiếp. Có anyway để loại bỏ các margin-trái hàng đầu: 20px từ khoảng đầu tiên của hàng mà không cần phải qua đi xe nó bằng tay?

Answer 1

Đó 20px lề bạn nhìn thấy trên khu vực #mainContent của bạn là do các thiết lập của lưới điện bootstrap, trong đó sử dụng một container của 940px, nó là vụ phải được gỡ bỏ bởi các .row container với một tài sản margin-left:-20px. Trong thiết lập của bạn, khu vực nội dung của bạn cũng đang hoạt động giống như cách thiết kế, nhưng các phần pageHeader và mainNav trên cùng của bạn không được chèn vào lưới một cách thích hợp, bạn chỉ có các div bên trong các phần trên cùng của .row không được chứa trong vùng chứa thích hợp của lưới.

Để khắc phục điều này, bạn chỉ có thể chèn tất cả các thành phần pageHeader và mainNav bên trong một vùng chứa .span12 và mọi thứ sẽ được sắp xếp tương ứng.

Fixed đánh dấu

<header class="row" id="pageHeader"> 
    <div class="span12"> 
     <div id="logo">Logo</div> 
     <div id="userDetails">userDetails</div> 
    </div> 
</header> 

<nav id="mainNav" class="row"> 
    <div class="span12"> 
     <ul> 
      <li><a href="home.html">Home</a></li> 
      <li><a href="dashboard.html">Dashboard</a></li> 
      <li><a href="blog.html">Blog</a></li> 
      <li><a href="idea_exchange.html">Idea Exchange</a></li> 
     </ul> 
    </div> 
</nav> 

Ngoài ra, mẹo nhanh chóng, bạn có thể chuyển màu mainNav nền của bạn để container lưới đúng .span12 đơn giản bằng cách nhắm mục tiêu nó như vậy:

nav#mainNav .span12 { 
    background: url("../images/nav_bar_bg.png") repeat-x scroll 0 0 transparent; 
    height: 45px; 
    overflow: hidden; 
} 

Answer 2

có cũng ít tiện ích nhỏ hơn tại

http://getkickstrap.com/extras/#single-view

gọi flushspan

Answer 3

bạn có thể thêm một lớp trong css của bạn với một quan trọng:

dụ:

.no_margin{ 
margin:0px !important; 
} 

và thêm lớp để html của bạn khi cần thiết.

(xin lỗi vì xấu xD tiếng anh của tôi)

Answer 4

Bằng cách sử dụng "hàng" hoặc lớp "hàng-chất lỏng" như mẹ của span class của bạn

<div class="row"> 
    <div class="span3"> 
     <ul> 
      <li><a href="home.html">Home</a></li> 
      <li><a href="dashboard.html">Dashboard</a></li> 
      <li><a href="blog.html">Blog</a></li> 
      <li><a href="idea_exchange.html">Idea Exchange</a></li> 
     </ul> 
    </div> 
</div>