Why won't the slider inherit my theme's style?

You can't make sliders inherit the CSS codes of your website. In this documentation we will get through each issue about why.

It is not possible to know what you want to be inherited

You might think it is obvious what you want to be inherited, but it is not. For example fonts have colors, font families, alignments, sizes, paddings, margins, etc.. Letting everything be inherited from your website would not create the result you are after.

Smart Slider sliders were made to have their own style

If you go to the admin area and create a slider, on the frontend of the website users are expecting the slider to look exactly the same. We are using a lot of CSS codes to make sure nothing overwrites the style.

You cannot make CSS codes disappear

Since we are using or own CSS codes, these cannot just disappear. CSS offers some solutions, but there isn't one, which would remove a code completely. Let's say you have a HTML structure like this:

<div style="color:blue;">
    <h1 style="color:[comes from Smart Slider];">My Heading</h1>
</div>

and in your website's theme you have this CSS code:

h1{
    color:red;
}

You must define a color for the heading where you have these options:

color: color|initial|inherit;

so if you do not want to specify a color, you can only use initial or inherit. What these options would do is:

initial

The color would turn into the browser default color. In most browsers in my example this would turn the h1 element to black.

inherit

The color is inherited from the parent element. In my example the h1 element would become blue, because of the parent div's color.

So you cannot write anything within our option to make the h1 theme CSS code to be applied to this h1 element.

Summed up

Don't try to inherit the style of your theme, but use our editor to make the slides look the way you want them to. This is what our plugin was intented to do, to be in complete control over the style of the sliders.