2013-07-15 35 views
0

我有2個鏈接與圖文並希望文字修飾:無;但由於某種原因,它不會消失,我總是得到一個懸停線。文字修飾:沒有不適用於Rails鏈接

的鏈接是:

<p class="user-profile-social-links pull-right"> 
    <% if @user.facebooklink.present? %> 
     <%= link_to @user.facebooklink, title: "Facebook", :target => '_blank' do %> 
      <i class="icon-facebook-sign"></i> 
     <% end %> 
    <% end %> 

    <% if @user.twitterlink.present? %> 
     <%= link_to @user.twitterlink, title: "Twitter", :target => '_blank' do %> 
      <i class="icon-twitter-sign"></i> 
     <% end %> 
    <% end %> 
</p> 

和類有這個CSS:

.user-profile-social-links { 
text-decoration: none; 
display: block; 
color: #777; 
} 

我做錯什麼了嗎?爲什麼它不工作?

* 編輯:* 這就是我仍然得到 - >http://imgur.com/raC362u(放大一點點,看看行圖標下面)

回答

5

我覺得加雷思是正確的。 但是可能有一種風格會覆蓋這個風格。

嘗試增加!important

.user-profile-social-links a { 
    text-decoration: none !important; 
    color: #777; 
} 
+0

謝謝!!!重要! –

+2

小心使用'!important',因爲如果你不使用它正確或不知道它會如何表現它會產生不希望的樣式在其他元素上[When Using!important is the Right Choice](http://css-tricks.com/when-using-important-is-the-right-choice/)檢查鏈接只是一個快速教程和一些有關它的行爲及其功能的信息。 –

+0

它的工作原理實際上表明它覆蓋了某個地方。意思是,檢查你的代碼的其餘部分!因爲我同意塞繆爾洛佩茲的評論! – LinkinTED

2

你對你p.user-profile-social-links設置這些樣式,和p元素已經沒有文字修飾,所以這部分規則實際上什麼都不做。

您需要應用一些這些風格在你pa元素:

.user-profile-social-links a { 
    text-decoration: none; 
    color: #777; 
} 

.user-profile-social-links { 
    display: block; 
} 
+0

我想這:(但即時得到反正下面有一行 - > http://imgur.com/raC362u(縮小一點點) –

1

鏈接有一個默認的文本修飾並且可以通過放置在您的application.css這在任何地方進行更改:

a:-webkit-any-link { 
    text-decoration: none; 
    cursor: auto; 
}