격자가 제대로 작동하지 않습니다.

Question

격자 시스템으로 사이트를 만들고 싶었습니다. (나는 이미 하나를 만들었습니다, 그래서 나는/작동 방법을 알고 있었다 알고)

이 내 custum 그리드입니다 : http://grids.heroku.com/grid.css?column_width=100&column_amount=8&gutter_width=15

그리고 지금 문제가 온다 : 나는 클래스 아무것도로 prefix_1 넣어하려고하면 그냥 일 같은 장소에있다. 그리고 나는 하나의 prefix_1 grid_3과 하나의 grid_4를 가지고 있습니다. 1 + 3 + 4 = 8이됩니다. 내 그리드는 8 열 너비이므로 쉽게 맞춰야하지만 그렇지 않습니다. http://jsfiddle.net/gekkeabt/5LA82/

<div class="container_8"> 
<span id="download" class="prefix_1 grid_3"><a href="#"><b>Download</b> Leasy CMS</a></span> 
<span id="download" class="grid_4"><a href="#"><b>Download</b> Macha Webserver</a></span> 
<span id="about" class="prefix_2 grid_4 suffix_2"><a href="#"><b>About</b> Me</a></span> 
</div> 

나는 내 코드 100 번 확인. 하지만 어디서 잘못되었는지는 알 수 없습니다.

어쩌면 누군가 나를 도울 수 있습니까?

감사합니다.

EDIT : 스팬 외부의 다른 div에 클래스를 정의하여 접두어 및 접미어 문제를 해결했습니다. 은 그래서 같이 보인다 :

<div class="prefix_1 grid_3"><span id="download">The content....</span></div> 

Answer 1

(2 × 50 픽셀의 또는 적어도 수평 패딩) 당신의 #download,#about CSS 선언에서

padding:10px 50px 10px 50px; 

라인을 제거하십시오.

요소를 하나의 행보다 넓게 만드는 것은 여분의 패딩입니다.

는 여기가 그 라인없이 보이는 방법은 다음과 같습니다 http://jsfiddle.net/WHG4u/

Answer 2

슬라이드가 변경 될 때마다

.avia-content-slider-active .slide-entry-wrap { height: 275px; }