CSS：刪除多餘的空間，當2周的div是在Chrome

鏈接中我有以下形式的鏈接內的兩個div：CSS：刪除多餘的空間，當2周的div是在Chrome

<a href="#" id="wrapper> 
    <div class="div1"></div> 
    <div class="div2">Text</div> 
</a>

CSS和HTML鏈接：（）

在簡而言之，「div1」用於鏈接的背景圖像，而「div2」是鏈接中的一些文本...如果您在JSFiddle（上面的鏈接）中運行此操作，則可以看到在頁面上有一個小的不需要的邊距左... （在Chrome瀏覽器!!）

誰能告訴我如何刪除這個空間？（我保持兩個div的鏈接裏面因特殊原因，所以需要改變結構或簡單地設置「背景圖片」整個鏈接不會爲我工作的任何解決方案）

換句話說，我想保留「div1」。

謝謝！

來源

2015-01-01 user3878106

[類似這樣？]（http://jsfiddle.net/gfjnosvg/3/） –

不知道你指的是什麼不必要的邊距。我正在使用最新的Chrome版本，並沒有真正看到任何這樣的事情。你可能會添加一些屏幕截圖並指出？你是否有機會參考藍色區域？如果是的話，那是第一個'div'。 – Harry

Div 1顯示爲頁邊距，因爲它實際上沒有顯示爲塊元素的寬度。嘗試在Div 1中添加一個寬度，使其顯示出來。

謝謝。

來源

2015-01-01 08:45:49

之前有一位用戶在這裏發佈了這個消息，但他刪除了他的答案。

使用display:-webkit-table-cell;

#wrapper { 
 
    display: inline-table; 
 
    background-color: red; 
 
    
 
    width: 20vw; 
 
    height: 20vw; 
 
} 
 

 
.div1 { 
 
    display: -webkit-table-cell; 
 
    
 
    background-image: url("http://doc.jsfiddle.net/_downloads/jsfiddle-desktop-1440x900-a.png"); 
 
    background-size: cover; 
 
    background-repeat: no-repeat; 
 
} 
 

 
.div2 { 
 
    display: -webkit-table-cell; 
 
}

<a href="#" id="wrapper"> 
 
    <div class="div1"></div> 
 
    <div class="div2">Text</div> 
 
</a>

來源

2015-01-01 08:50:03

默認情況下，大多數瀏覽器添加一些保證金周圍的外面，但你可以設置身體有保證金：0和padding：0解決這個問題，我將此代碼添加到您的jsfiddle刪除間距：

body { 
margin: 0; 
}

我甚至走這麼遠，說你真的需要使用像這樣的瀏覽器重置：http://nicolasgallagher.com/about-normalize-css/

來源

2015-01-01 10:32:33

CSS：刪除多餘的空間，當2周的div是在Chrome

回答

相關問題