javascript grid中線條之間的差距

Question

我做了一個使用兩個javascript for循環的網格， 由於某種原因，我在網格中的線條之間有一個固定的間隙。 我不明白是什麼導致了差距。

這是我做的。

var length = 100; 

var text = ""; 
var i; 
for (i = 0; i < length; i++) { 
text += '<div>'; 
    for(var x = 0; x < length; x++){ 
     text += '<div class="b"></div>'; 
    } 
text += '</div>'; 
} 

https://jsfiddle.net/davseveloff/wL3Ljpxo/

我假定這是什麼原因造成的div的都是空的，雖然他們有寬度和高度ATT ...

任何幫助將是巨大的。

TNX

Answer 1

這是因爲元素和<br>標籤之間的空間得到呈現爲文本，如果你設置字體大小爲0它會刪除的差距，同時還打破了線。

（Demo）

#demo { 
    font-size: 0; 
} 

Answer 2

添加類和同一高度適用於外層div。

for (i = 0; i < length; i++) { 
    text += '<div class="row">';// 
    for(var x = 0; x < length; x++){ 
     text += '<div class="b"></div>'; 
    } 
    text += '</div>'; 
} 

CSS

.row{ 
    height: 2px; 
} 

http://jsfiddle.net/afelixj/xrcgfm7g/

請檢查小提琴。爲了清晰起見，我將網格大小增加到了5px，並刪除了背景圖片。