[airbdesignParticipant]

Hmmm, I just copied and pasted that however it didn’t make a change.
Any thoughts on that?

Thanks!

[FriechModerator]

Hi There,

I’m not seeing the code on your custom CSS, please make sure to add this under Custom > CSS in the Customizer.

a.x-slider-scroll-bottom:hover{
    border-color: green;
    color: green;
}

Hope it helps, Cheers!

[airbdesignParticipant]

I was entering it in the custom java script area instead of the CSS.

That worked thanks!

[Morphe NZParticipant]

Hi, I am jumping in here too if it’s okay.

I am using Cornerstone.
I was able to add the down arrow with the circle nicely aligned but… How do I get the arrow to appear at the bottom of the page with any screen size etc? My section is set to height:100vh; which makes it ‘fullscreen’.

I can not figure out how to make it aligned to the bottom of the section.

Thanks for the help in advance.

[FriechModerator]

Hi There,

Thanks for writing in! To assist you with this issue, we’ll first need you to provide us with your URL. This is to ensure that we can provide you with a tailored answer to your situation. Once you have provided us with your URL, we will be happy to assist you with everything.

@airbdesign Glad you sorted things out.

Cheers!

[Morphe NZParticipant]

Please see my dev account – http://test.m45machinedesign.com.au/index.php/cornerstone-draft/

[ChristopherModerator]

Hi there,

Please remove height: 90vh; from section’s style field since your content needs more height than this and that’s the reasons you see down arrow in white screen.
Or keep the height property and instead remove padding from section and add mtn mbn in custom headline’s class field.

Thanks.

[Morphe NZParticipant]

Hi,

The reason I used height: 90vh; is that I wanted to have a ‘fullscreen’ section (originally I used 100vh but now use 90 to compensate for the header.

Is there anyway to get it to be fullscreen with the down arrow still working then?

Thanks

[ZeshanMember]

Hi Werner,

You can try using min-height property rather than fixed height:

min-height: 90vh;

Thanks!

[Morphe NZParticipant]

This reply has been marked as private.

[ChristopherModerator]

Hi there,

Are you looking for something like this (http://theme.co/x/demo/ethos/2/)?
If so you need to set a slider below masthead and add ‘.mastead` in slider offset container’s field.
If I’m not referring to right point please clarify.

Hope it helps.

[Morphe NZParticipant]

Hi,

I was kind of hoping not to use a slider if possible.

If you look at an external none theme x page such as https://www.google.com/drive/ you will see that they have a down arrow. Is it possible to create something like that on theme x without having to use a slider?

Same as the ethos 2 demo (Intergrity 7 demo etc.) that you shared, but without the use of revolution slider or other sliders?

Thanks.

[ChristopherModerator]

Hi there,

You have already achieved that but the issue it that offset container (which keeps the slider full height on all screen sizes) can be set only with revolution slider.

If you decide to keep it this way please update your code to following in order to link the arrow to next section, currently it doesn’t move :

<a href="#x-section-2" class="x-slider-scroll-bottom"><i class="x-icon-angle-down"></i></a>

Hope that helps.

[Morphe NZParticipant]

Hi,

thank you very much for your help and the code above! It seems to be all working now. If all else fails I will use the revolution slider option.

[Paul RModerator]

You’re welcome! 🙂

[Author]

Posts