Title: Invalid CSS shadows
Last modified: May 9, 2017

---

# Invalid CSS shadows

 *  Resolved [Tim Havinga](https://wordpress.org/support/users/timhavinga/)
 * (@timhavinga)
 * [9 years ago](https://wordpress.org/support/topic/invalid-css-shadows/)
 * I am using a popup with a drop shadow. However, the shadow is not rendered because
   the generated CSS is incorrect. It reads for instance:
 * `box-shadow: 0px 0px 10px 5px rgba( 2, 2, 2, 0,5 );`
 * The `0,5` should be `0.5`.
    In the popup preview, the CSS is generated correctly.
   The same is true for text shadows.

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

 *  [Robert Gadon](https://wordpress.org/support/users/yogaman5020/)
 * (@yogaman5020)
 * [9 years ago](https://wordpress.org/support/topic/invalid-css-shadows/#post-9113956)
 * [@timhavinga](https://wordpress.org/support/users/timhavinga/) I don’t know whether
   the CSS property-values you cite above are rendered by inline CSS from the plugin(
   which would be set using JavaScript). Can you post a URL link to your site and
   tell us what event triggers the popup? Am I correct to assume that the box-shadow
   is assigned to a popup container? Please provide more detail on which class attributes
   are being targeted with the ‘box-shadow’ property.
 *  Plugin Author [Daniel Iser](https://wordpress.org/support/users/danieliser/)
 * (@danieliser)
 * [9 years ago](https://wordpress.org/support/topic/invalid-css-shadows/#post-9119311)
 * [@timhavinga](https://wordpress.org/support/users/timhavinga/) – Hmm, not sure
   how that would happen, to be clear here is the code used to generate that [https://github.com/PopupMaker/Popup-Maker/blob/master/includes/css-functions.php#L30](https://github.com/PopupMaker/Popup-Maker/blob/master/includes/css-functions.php#L30)
 * It simply divides your chosen opacity by 100, which would never result in a comma
   value. It appears something is corrupting the output after that. A link would
   be helpful.
 *  Thread Starter [Tim Havinga](https://wordpress.org/support/users/timhavinga/)
 * (@timhavinga)
 * [9 years ago](https://wordpress.org/support/topic/invalid-css-shadows/#post-9120345)
 * Sorry, I don’t have a public website to link to.
 * [@yogaman5020](https://wordpress.org/support/users/yogaman5020/): Yes, I set 
   a shadow on the popup container. In fact, I altered the existing Enterprise Blue
   theme. Here’s the complete generated inline CSS:
 *     ```
       /* Popup Theme 39293: Enterprise Blue */
       .pum-theme-39293, .pum-theme-enterprise-blue { background-color: rgba( 0, 0, 0, 0 ) } 
       .pum-theme-39293 .pum-container, .pum-theme-enterprise-blue .pum-container { padding: 24px; border-radius: 5px; border: 1px none #000000; box-shadow: 0px 0px 10px 5px rgba( 2, 2, 2, 0,5 ); background-color: rgba( 247, 247, 247, 1 ) } 
       .pum-theme-39293 .pum-title, .pum-theme-enterprise-blue .pum-title { color: #fa3135; text-align: left; text-shadow: 0px 0px 0px rgba( 2, 2, 2, 0,23 ); font-family: inherit; font-weight: 600; font-size: 20px; line-height: 32px } 
       .pum-theme-39293 .pum-content, .pum-theme-enterprise-blue .pum-content { color: #2d2d2d; font-family: inherit } 
       .pum-theme-39293 .pum-content + .pum-close, .pum-theme-enterprise-blue .pum-content + .pum-close { height: 24px; width: 24px; left: auto; right: 4px; bottom: auto; top: 4px; padding: 4px; color: #ffffff; font-family: inherit; font-size: 16px; line-height: 16px; border: 1px none #ffffff; border-radius: 42px; box-shadow: 0px 0px 0px 0px rgba( 2, 2, 2, 0,23 ); text-shadow: 0px 0px 0px rgba( 0, 0, 0, 0,23 ); background-color: rgba( 49, 91, 124, 1 ) } 
       ```
   
 * As you can see, all rgba()-functions with a decimal part are outputted with a
   comma instead of a period.
 * I think this is a locale issue. I live in the Netherlands, where it is custom
   to write decimal numbers with a comma instead of the (US/UK) dot.
 * A solution would be to use PHPs number_format()-function on said line.
 *  Plugin Author [Daniel Iser](https://wordpress.org/support/users/danieliser/)
 * (@danieliser)
 * [9 years ago](https://wordpress.org/support/topic/invalid-css-shadows/#post-9139338)
 * [@timhavinga](https://wordpress.org/support/users/timhavinga/) – Good call, did
   some research and in fact number_format is not locale aware, so it will force
   the expected value. Added a credit in the changelogs.
 * This is working for me, can you test it works as expected for you?
 * I just added `number_format` before the existing (
 *     ```
       function popmake_get_rgba_value( $hex, $opacity = 100 ) {
       	return 'rgba( ' . implode( ', ', popmake_hex2rgb( strval( $hex ) ) ) . ', ' . number_format( intval( $opacity ) / 100 ) . ' )';
       }
       ```
   
 * Let me know if that solves it for you. This will be in the 1.6.1 update tonight,
   so if that doesn’t work we will keep digging.
 *  Thread Starter [Tim Havinga](https://wordpress.org/support/users/timhavinga/)
 * (@timhavinga)
 * [9 years ago](https://wordpress.org/support/topic/invalid-css-shadows/#post-9144239)
 * Caution! According to [the documentation](http://php.net/manual/en/function.number-format.php),
   the default value for the number of decimals is 0. This is not what you want 
   in this situation, every decimal number will be rounded to either 0 or 1.
    I 
   suggest a value of 2 for the decimals parameter.
 * Aside from this, yes, the number is formatted correctly using `number_format`.
 *  Thread Starter [Tim Havinga](https://wordpress.org/support/users/timhavinga/)
 * (@timhavinga)
 * [9 years ago](https://wordpress.org/support/topic/invalid-css-shadows/#post-9144266)
 * Just saw your commit where you included the decimals parameter, excellent.
 * Note that you are currently using three parameters, while the doc states:
 * > This function accepts either one, two, or four parameters (not three)
 * I suggest using just two.
 *  Plugin Author [Daniel Iser](https://wordpress.org/support/users/danieliser/)
 * (@danieliser)
 * [9 years ago](https://wordpress.org/support/topic/invalid-css-shadows/#post-9175511)
 * [@timhavinga](https://wordpress.org/support/users/timhavinga/) – Thanks yea we
   got it corrected.
 * Closing this now as we got it resolve finally.
 * Take care, Please take a moment to click that it [Works](https://wordpress.org/plugins/popup-maker/#compatibility)
   and to [rate and review the plugin](https://wordpress.org/support/plugin/popup-maker/reviews/?rate=5#rate-response)
   or support.

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

The topic ‘Invalid CSS shadows’ is closed to new replies.

 * ![](https://ps.w.org/popup-maker/assets/icon-256x256.gif?rev=3097653)
 * [Popup Maker - Boost Sales, Conversions, Optins, Subscribers with the Ultimate WP Popup Builder](https://wordpress.org/plugins/popup-maker/)
 * [Frequently Asked Questions](https://wordpress.org/plugins/popup-maker/#faq)
 * [Support Threads](https://wordpress.org/support/plugin/popup-maker/)
 * [Active Topics](https://wordpress.org/support/plugin/popup-maker/active/)
 * [Unresolved Topics](https://wordpress.org/support/plugin/popup-maker/unresolved/)
 * [Reviews](https://wordpress.org/support/plugin/popup-maker/reviews/)

 * 7 replies
 * 3 participants
 * Last reply from: [Daniel Iser](https://wordpress.org/support/users/danieliser/)
 * Last activity: [9 years ago](https://wordpress.org/support/topic/invalid-css-shadows/#post-9175511)
 * Status: resolved