Title: Custom css doesn’t work
Last modified: July 13, 2024

---

# Custom css doesn’t work

 *  Resolved [ll2pakll](https://wordpress.org/support/users/ll2pakll/)
 * (@ll2pakll)
 * [1 year, 11 months ago](https://wordpress.org/support/topic/custom-css-doesnt-work-20/)
 * Hi. I’m trying to make the borders of the sliders on my site rounded. To do this,
   I added this code to the additional styles on my site
 *     ```wp-block-code
       .metaslider {
           border-radius: 30px;
       }
       ```
   
 * But this code doesn’t change the appearance of the sliders. What am I doing wrong?
 * The page I need help with: _[[log in](https://login.wordpress.org/?redirect_to=https%3A%2F%2Fwordpress.org%2Fsupport%2Ftopic%2Fcustom-css-doesnt-work-20%2F%3Foutput_format%3Dmd&locale=en_US)
   to see the link]_

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

 *  Thread Starter [ll2pakll](https://wordpress.org/support/users/ll2pakll/)
 * (@ll2pakll)
 * [1 year, 10 months ago](https://wordpress.org/support/topic/custom-css-doesnt-work-20/#post-17888424)
 * Through trial and error, I found the right selector. But this selector allows
   to select each slider separately, because the class name for each slide includes
   the slider id number. Is it possible to assign one class to all slides? (Assigning
   a class in Developer Options doesn’t help, I’ve tried it).
 *     ```wp-block-code
       .slider-51 {	border-radius:61px}
       ```
   
 *  Thread Starter [ll2pakll](https://wordpress.org/support/users/ll2pakll/)
 * (@ll2pakll)
 * [1 year, 10 months ago](https://wordpress.org/support/topic/custom-css-doesnt-work-20/#post-17888439)
 * It worked when I wrote the JavaScript. Maybe someone could use it.
 *     ```wp-block-code
       document.addEventListener('DOMContentLoaded', () => {  // Select all elements  const allElements = document.querySelectorAll('*');    // Define the regex pattern for class names starting with "slider-" followed by a number  const sliderClassPattern = /^slider-\d+$/;  // Loop through each element and check if any class name matches the pattern  allElements.forEach(element => {    element.classList.forEach(className => {      if (sliderClassPattern.test(className)) {        // Set the border-radius property        element.style.borderRadius = '61px';      }    });  });});
       ```
   
 *  Plugin Author [htmgarcia](https://wordpress.org/support/users/htmgarcia/)
 * (@htmgarcia)
 * [1 year, 10 months ago](https://wordpress.org/support/topic/custom-css-doesnt-work-20/#post-17890631)
 * Hi [@ll2pakll](https://wordpress.org/support/users/ll2pakll/)
 * in cases like this we would recommend this selector, where 123 needs to be replaced
   with the actual slideshow ID:
 *     ```wp-block-code
       #metaslider-id-123 ul.slides > li {}
       ```
   
 * Regards

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

The topic ‘Custom css doesn’t work’ is closed to new replies.

 * ![](https://ps.w.org/ml-slider/assets/icon.svg?rev=3523572)
 * [Slider, Gallery, and Carousel by MetaSlider - Image Slider, Video Slider](https://wordpress.org/plugins/ml-slider/)
 * [Frequently Asked Questions](https://wordpress.org/plugins/ml-slider/#faq)
 * [Support Threads](https://wordpress.org/support/plugin/ml-slider/)
 * [Active Topics](https://wordpress.org/support/plugin/ml-slider/active/)
 * [Unresolved Topics](https://wordpress.org/support/plugin/ml-slider/unresolved/)
 * [Reviews](https://wordpress.org/support/plugin/ml-slider/reviews/)

## Tags

 * [css](https://wordpress.org/support/topic-tag/css/)

 * 3 replies
 * 2 participants
 * Last reply from: [htmgarcia](https://wordpress.org/support/users/htmgarcia/)
 * Last activity: [1 year, 10 months ago](https://wordpress.org/support/topic/custom-css-doesnt-work-20/#post-17890631)
 * Status: resolved