TIPS: Highlight Activity on Mouse Over

I learn this form Google+. When you focus on one activity feed, you need to highlight it to make it more outstanding and readable. So this tips will tell you how to highlight one activity feed when mouse over:

It's really simple:

1. Download this CSS file mouse_over_highlight_activity.css

2. Open it in any text editor. Modify the padding, margin, border and background color for your site.

You can easily make a different beautiful gradient and get the CSS code here. Once you have the gradient code, copy and paste it between the two comments and add !improtant before every semicolon ; in the gradient CSS code:

/*mouse over highlight background color start*/

/*mouse over highlight background color end*/

If you don't need background, just remove the code between this two comments.

3. Copy and paste all these CSS code to Advanced CSS. No matter you use Design Studion or not.

Here is the snap pic of the CSS code in the file above:

This tips can be used with both Design Studio and old themes.

This work is licensed under a Creative Commons Attribution-Noncommercial-Share Alike 3.0 Unported License. Permissions beyond the scope of this license, pertaining to the examples of code included within this work are available at iYouMe.net.

Replies

classic September 18, 2011 at 9:39am

Beautiful
Thank you, Alex 小正正
I SOAL?
How do I change the color red to black?
- Alex 小正正 > classic September 18, 2011 at 10:22am
  Hi Ahmad,
  
  It's here:
  
  /*mouse over highlight right border*/
  
  border-right:3px solid black;
  - classic > Alex 小正正 September 18, 2011 at 2:30pm
    
    Thank
Atheist Universe September 22, 2011 at 4:29pm

+1
solo September 22, 2011 at 7:40pm

+1
Atheist Universe September 23, 2011 at 12:09pm

+1
Alex September 23, 2011 at 5:38pm

Sorry Alex.. I've done exactly as suggested using the gradient CSS code but it makes no difference..??

Our network

Any advice?
- Alex 小正正 > Alex September 25, 2011 at 4:12am
  
  Hi Alexander,
  
  Add !improtant before every semicolon ; in the gradient CSS code.
  - Alex > Alex 小正正 September 25, 2011 at 8:13am
    
    This is what I have ... but it doesn't work for us.
    - Alex 小正正 > Alex September 25, 2011 at 8:20am
      
      Try put a space between ) and !.
      
      And I check your site, can't see you add any code for div.feed-story:hover. I think maybe the struct of other CSS goes wrong. That makes it ignore this CSS code.