縮放時不需要的空間（div標籤）

我的頁面右下角有一個div背景圖片。問題是當我縮小時，在它和頁面的右下方之間出現一個小空間。我不確定它爲什麼這樣做。縮放時不需要的空間（div標籤）

我在這方面還很新，但是可以給予的任何幫助，我真的很感激。

下面是表示我縮放變化的圖像，和我有關HTML/CSS

enter image description here

這是我的HTML

<div id="bottom_bar"> 
<p>COPYRIGHT DAVIDMORRIS © 2014 | <a href="index.html">NEWSLETTER</a> | <a href="index.html">FACEBOOK</a> 
<span class="right">DESIGN: PROMISE LAND PARTNERS</span> 
</p> 
</div> 


<a href="index.html"> 
<div id="portfolio"></div> 
</a> 

</body>

，這是CSS

#portfolio { 
    background-image: url(img/portfoliopanel.png); 
    background-repeat: no-repeat; 
    height: 117px; 
    width: 198px; 
    position: absolute; 
    bottom: 27px; 
    right: 0%; 
    margin: 0; 
    padding: 0; 
} 

#portfolio:hover { 
    background-image: url(img/portfolio_pushed.png); 
}

來源

2014-02-12 DiscipleDavid

您可以創建一個的jsfiddle樣本這個問題。 – Jineesh

我認爲這種方式對你很有用，在這裏我提到.nautur e_image類DIV是自然圖像背景格，你只需要使用#portfolio事業部的該父LYK這樣的：

HTML

<div class="nature_image"> 
    <a href="index.html"> 
      <div id="portfolio"></div> 
    </a> 
</div> 


<div id="bottom_bar"> 
<p>COPYRIGHT DAVIDMORRIS © 2014 | <a href="index.html">NEWSLETTER</a> | <a href="index.html">FACEBOOK</a> 
<span class="right">DESIGN: PROMISE LAND PARTNERS</span> 
</p> 
</div> 

</body>

然後用下面的CSS LYK，U應該給的位置是：相對的，具體的提父div（.nature_image div）的高度，然後也給位置：絕對和底部：0;兒童#portfolio ID DIV

CSS：

.nature_image{ 
    background-image: url(img/nauture_image_bg.png); 
    background-repeat: no-repeat; 
    height: 480pxpx; 
    width: 100%px; 
    position: relative; 
    left:0; 
    top: 0; 
    margin: 0; 
    padding: 0; 
} 

#portfolio { 
    background-image: url(img/portfoliopanel.png); 
    background-repeat: no-repeat; 
    height: 117px; 
    width: 198px; 
    position: absolute; 
    bottom: 0px; 
    right: 0%; 
    margin: 0; 
    padding: 0; 
}

我相信這是對你有用，

感謝

塞特希

來源

2014-02-12 04:44:13

縮放時不需要的空間（div標籤）

回答

相關問題