Title: CSS Glowing Effect
Last modified: December 2, 2020

---

# CSS Glowing Effect

 *  [esmelndn](https://wordpress.org/support/users/esmelndn/)
 * (@esmelndn)
 * [5 years, 6 months ago](https://wordpress.org/support/topic/css-glowing-effect/)
 * Hello All,
 * Please point me in the right direction on how to add CSS to OceanWP to achieve
   a “glowing effect” for menu links (about, press, projects, etc.). I have tried
   for over 24 hours to use “menu-main-menu,” “site-navigation,” & other selectors
   to achieve the desired outcome (which is [https://www.w3schools.com/howto/howto_css_glowing_text.asp](https://www.w3schools.com/howto/howto_css_glowing_text.asp))
   to no avail. See below. Please help!!!
 * I’ve tried
 * #site-navigation{
    font-size: 80px; color: #fff; text-align: center; -webkit-
   animation: glow 1s ease-in-out infinite alternate; -moz-animation: glow 1s ease-
   in-out infinite alternate; animation: glow 1s ease-in-out infinite alternate;}
 * @-webkit-keyframes glow {
    from { text-shadow: 0 0 10px #fff, 0 0 20px #fff, 
   0 0 30px #e60073, 0 0 40px #e60073, 0 0 50px #e60073, 0 0 60px #e60073, 0 0 70px#
   e60073; } to { text-shadow: 0 0 20px #fff, 0 0 30px #ff4da6, 0 0 40px #ff4da6,
   0 0 50px #ff4da6, 0 0 60px #ff4da6, 0 0 70px #ff4da6, 0 0 80px #ff4da6; } }
 * The page I need help with: _[[log in](https://login.wordpress.org/?redirect_to=https%3A%2F%2Fwordpress.org%2Fsupport%2Ftopic%2Fcss-glowing-effect%2F%3Foutput_format%3Dmd&locale=en_US)
   to see the link]_

Viewing 2 replies - 1 through 2 (of 2 total)

 *  [Abhishek](https://wordpress.org/support/users/abhikr781/)
 * (@abhikr781)
 * [5 years, 6 months ago](https://wordpress.org/support/topic/css-glowing-effect/#post-13753950)
 * Hello,
 * try to add the below CSS code and check.
 *     ```
       #site-navigation-wrap .dropdown-menu >li >a {
       font-size: 15px;
       color: #fff;
       text-align: center;
       -webkit-animation: glow 1s ease-in-out infinite alternate;
       -moz-animation: glow 1s ease-in-out infinite alternate;
       animation: glow 1s ease-in-out infinite alternate;
       }
   
       @-webkit-keyframes glow {
       from {
       text-shadow: 0 0 10px #fff, 0 0 20px #fff, 0 0 30px #e60073, 0 0 40px #e60073, 0 0 50px #e60073, 0 0 60px #e60073, 0 0 70px #e60073;
       }
       to {
       text-shadow: 0 0 20px #fff, 0 0 30px #ff4da6, 0 0 40px #ff4da6, 0 0 50px #ff4da6, 0 0 60px #ff4da6, 0 0 70px #ff4da6, 0 0 80px #ff4da6;
       }
       }
       ```
   
 *  Thread Starter [esmelndn](https://wordpress.org/support/users/esmelndn/)
 * (@esmelndn)
 * [5 years, 6 months ago](https://wordpress.org/support/topic/css-glowing-effect/#post-13754226)
 * Thank you [@abhikr781](https://wordpress.org/support/users/abhikr781/). I was
   able to fix my code & sort it out. Thank you for your help.

Viewing 2 replies - 1 through 2 (of 2 total)

The topic ‘CSS Glowing Effect’ is closed to new replies.

 * ![](https://i0.wp.com/themes.svn.wordpress.org/oceanwp/4.1.6/screenshot.png)
 * OceanWP
 * [Support Threads](https://wordpress.org/support/theme/oceanwp/)
 * [Active Topics](https://wordpress.org/support/theme/oceanwp/active/)
 * [Unresolved Topics](https://wordpress.org/support/theme/oceanwp/unresolved/)
 * [Reviews](https://wordpress.org/support/theme/oceanwp/reviews/)

 * 2 replies
 * 2 participants
 * Last reply from: [esmelndn](https://wordpress.org/support/users/esmelndn/)
 * Last activity: [5 years, 6 months ago](https://wordpress.org/support/topic/css-glowing-effect/#post-13754226)
 * Status: not resolved