Cornerstone -> Classic Slider -> Align Text to Center / Left Margin

Support
#1

I have tried to use the Classic Slider in Cornerstone (Integrity Theme).

However, when using text only I could not center the text properly.

It looks like the Classic Slider element has always some margin on the left-hand side.

How can I get rid of this left-margin and make sure, the text is really centered in the Slider?

Thank you for your support and for the amazing work!

All the best,
Andrea

#2

Hello There,

Thanks for writing in!

By default, the contents of the slides will be align to the left. To make sure that the slide contents will be align to the center, please add the following CSS code in the X > Theme Options > Global CSS (http://prntscr.com/evui3r)

.x-flexslider .x-slides .x-slide {
    text-align: center;
}

We would loved to know if this has work for you. Thank you.

#3

@RueNel

Thank you!

No, it didn’t change much. (Actually I saw this answer in another post and tried it already.)

My “theory” is that on the left-hand side of the slider there is some space/margin reserved for the control navigation, I have deactivated them, because I prefer to have an auto-slider.

Thanks for any help!

All the best,
Andrea

#4

Hello There,

The code should have work. There should be no space on the left side or right side. The control arrow navigation stays on top of the slide thus anything you place inside the slide should be centered once you have applied the css code. Could you please provide us the url where we can find your slider?

Thank you in advance.

#5

Sure: It’s https://www.salesgrowth.io/about/

–> The slider is visible in the mobile view only and is placed right under the top-section. (“3 Tech Companies Founded”).

Thanks,
Andrea

#6

Hello There,

Are you using CSS Hero? It is adding a 20 pixel margin for the slider.

html .page .site .x-main article.hentry .entry-content ul li {
    font-weight: 400;
    font-size: 16px;
    color: #000;
    text-align: left;
    line-height: 1.5;
    margin-left: 20px;
    padding-top: 10px;
    letter-spacing: 0px;
    background-repeat: no-repeat;
    list-style-position: outside;
}

Please disable CSS hero and check your site again.

#7

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.