我看不到我的社交媒體按鈕

我看到我的社交按鈕時出現問題，它們顯示並且可點擊，但無法看到按鈕。我看不到我的社交媒體按鈕

這是我的HTML標籤：

<div class="social_buttons"> 

    <ul> 

     <li><div class="fb-btn"><a href="" target="_blank">Facebook</a></div></li> 
     <li><div class="ln-btn"><a href="" target="_blank">LinkedIn</a></div></li> 
     <li><div class="tw-btn"><a href="" target="_blank">Twitter</a></div></li> 
     <li><div class="gp-btn"><a href="" rel="publisher" target="_blank">Google+</a></div></li> 
     <li><div class="yt-btn"><a href="" target="_blank">Youtube</a></div></li> 

    </ul> 

</div>

這是CSS文件，該文件爲HTML標籤：

.social_buttons { 
    width: 41px; 
    position: fixed; 
    right: 0px; 
    top: 145px; 
} 
.social_buttons a { 
    display:block; 
    width: 100%; 
    height: 100%; 
    text-indent: -9999px; 
} 
.social_buttons ul { 
    margin: 0px; 
    padding: 0px; 
} 
.social_buttons li { 
    float: left; 
} 
.social_buttons .fb-btn, .social_buttons .ln-btn, .social_buttons .tw-btn, .social_buttons .gp-btn, .social_buttons .yt-btn, .social_buttons .sh-btn { 
    background-repeat: no-repeat; 
    width: 45px; 
    height: 45px; 
    margin-bottom: 10px; 
} 
.social_buttons .fb-btn { 
    background-image: url("../img/social_buttons/1463808493_facebook.png"); 
} 
.social_buttons .ln-btn { 
    background-image: url("../img/social_buttons/1463808541_linkedin.png"); 
} 
.social_buttons .tw-btn { 
    background-image: url("../img/social_buttons/1463808521_twitter1.png"); 
} 
.social_buttons .gp-btn { 
    background-image: url("../img/social_buttons/1463808579_google.png"); 
} 
.social_buttons .yt-btn { 
    background-image: url("../img/social_buttons/1463808557_youtube2.png"); 
}

將不勝感激，我fsomeone可以回答這個問題！

來源

2016-05-26 ajax_27

背景圖片的參考是不正確的。現在它的工作正常。謝謝。 –

你有正確的設置爲0，頂部設置一個固定的位置145px，如果你不想用像素來定位你的按鈕，刪除該位置：固定值

.social_buttons { 
    // position:fixed; // <---- remove this 
    width: 41px; 
    // right: 0px; // <---- remove this 
    // top: 145px; // <---- remove this 
}

而且，你的CSS引用圖像的URL爲背景，確保他們相對存在到你的CSS文件是：

.social_buttons .gp-btn { 
    background-image: url("../img/social_buttons/1463808579_google.png"); // make sure image file exists in this location 
}

然後，您應該能夠看到你的按鈕。

來源

2016-05-26 22:22:27

麻煩的是你的CSS的第一塊：

.social_buttons { 
    width: 41px; 
    position: fixed; 
    right: 0px; 
    top: 145px; 
}

它隱藏在你關閉鏈接到頁面的右側。如果我刪除所有的CSS，但它可以正常工作。

來源

2016-05-26 22:23:10 harshaw61

嘗試用寬度41px除去寬度

.social_buttons { 
    width: 41px; 
    }

這裏，所有按鈕都遍佈彼此。通過刪除它，div .social_buttons將佔據所有按鈕的全部寬度。

如果您想在頁面的其他位置定位按鈕，您可以嘗試使用頂部和右側/左側進行播放。

來源

2016-05-26 22:29:09 Nic727

我看不到我的社交媒體按鈕

回答

相關問題