Question

我在查看社交按钮时出现问题，它们出现并且可点击但我看不到按钮。

这些是我的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"); 
}

这是HTML标记的CSS文件：

template <unsigned int DIM>
MyVector<DIM> MyVector<DIM>::operator+(MyVector& other) {
    MyVector ans = MyVector<DIM>();
    #pragma omp parallel for
    for (unsigned int i = 0; i < DIM; ++i)
    {
        std::cout << omp_get_thread_num() << std::endl;
        ans.values_[i] = values_[i] + other.values_[i];
    }
    return ans;
}

如果有人能回答这个问题，我将不胜感激！

Answer 1

你有一个固定的位置，右边设置为0，顶部设置为145px，如果你不想按像素定位按钮，删除位置：固定值

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

另外，你的css引用背景的图片网址，确保它们相对于css文件的位置存在：

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

然后你应该可以看到你的按钮了。

Answer 2

问题是CSS的第一个块：

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

它将您的链接隐藏在页面右侧。如果我删除了所有的CSS，那么它可以正常工作。

Answer 3

尝试删除宽度

 .social_buttons {
   width: 41px;
  }

宽度为41px，所有按钮都是相互重叠的。通过删除它，div .social_buttons将占用所有按钮的全宽。

如果您想将按钮放在页面的其他位置，您可以尝试使用顶部和右侧/左侧。

我看不到我的社交媒体按钮

3 个答案: