額外填充在IMGS

我有兩個IMG標籤之間微胖（4PX）之間的麻煩CSS。這發生在Mac（Snow Leopard）上的Firefox 7.0.1，Safari 5.1.1，Chrome 11.0.696.68和Opera 10.53中。額外填充在IMGS

我在這裏上傳的例子： http://husnoo.com/img_extra_space/img_extra_space.html

隨着它看起來像一個截圖： http://husnoo.com/img_extra_space/shot.png

兩個IMGS之間的4個像素不應該存在。

謝謝！

納瓦勒。

代碼：圖像之間

<!DOCTYPE html> 
<html> 
<head> 
    <title>Title here</title> 
    <style type="text/css"> 
     body { 
      margin: 0px; 
      padding: 0px; 
     } 
     toolbar { 
      background-color: #ddd; 
      margin: 0px; 
      padding: 0px; 
      width: 32px; 
      height: 32px; 
     } 

     #tool1 { 
      background-color: #0dc; 
      margin: 0px; 
      padding: 0px; 
      width: 32px; 
      height: 32px; 
     } 

     #tool2 { 
      background-color: #6dc; 
      margin: 0px; 
      padding: 0px; 
      width: 32px; 
      height: 32px; 
     } 
    </style> 
</head> 
<body> 
    <div id="toolbar"> 
     <img id="tool1" src="select.png"> 
     <img id="tool2" src="transform_move.png"> 
    </div> 
</body> 
</html>

來源

2011-11-03 Nawal

不要斷行，而不是

<img id="tool1" src="select.png"> 
<img id="tool2" src="transform_move.png">

做

<img id="tool1" src="select.png"><img id="tool2" src="transform_move.png">

來源

2011-11-03 21:39:36

謝謝！這樣做！出於興趣....爲什麼？（我會在10分鐘內接受它，顯然我在此之前不能接受）。 – Nawal

@Nawal：渲染HTML時換行符被轉換爲空間，所以它就像是''當你想''。 – animuson

「\ n」個字符被視爲枝條空間 –

你要刪除這兩個的img標籤之間的空間。

也可以添加display:block;他們和float:left;

來源

2011-11-03 21:44:14 balsagoth

那麼你需要更多的CSS來解決其他問題。糟糕的想法 –

取決於你想達到甚至更容易。但無論如何，沒有那麼多的CSS。 – balsagoth

額外填充在IMGS

回答

相關問題