使用inline-block列並使用javascript刪除html空白的網格系統

Question

我已經編寫了一個類似bootstrap的CSS網格系統，但是我使用了內嵌塊而不是左浮動塊。 當然，我需要技巧來刪除行內塊列之間的空白。 我還寫了一個小的純JavaScript來做到這一點：

bodyzzz = document.getElementsByTagName("BODY")[0];
bodyzzz.innerHTML = body.innerHTML.replace(/>\s*\n*\r*\</g, '><');

我知道其他一些技巧可以消除空白，但是它們仍然存在錯誤（或弱點）。 那么，對於任何前端開發專家來說，我的竅門是什么？ 你們認為這種解決方案是最好的嗎？

Answer 1

我假設在將一個div放置在另一個div之下時，該空格是由於換行符引起的

這是一種擺脫空間的方法

片段

 div { display:inline-block; border:solid; width:100px; height:100px; margin:none; padding:0; } 

 <div> Content1 </div><div> Content2 </div><div> Content3 </div> 

請注意，起始div標簽與之前的div標簽結尾處在同一行

編輯：更好的是通過將css display設置為display:table-cell;

這是另一個片段

 div { display:table-cell; border:solid; width:100px; height:100px; margin:none; padding:0; } 

 <div> Content1 </div> <div> Content2 </div> <div> Content3 </div>