Scroll down arrow button hide on smaller viewports


#1

Hello.

Could you tell me please how to hide an element on smaller viewports. I have added a “scroll down arrow button” to the bottom of my home page slider, but on smaller viewports 768px and lower, I would like to hide the “scroll down arrow button” completely.

site link: http://creativew.com/theme

Love working on this theme! Thank you.
Esteban


#2

Hey ya’ll.
I was able to figure out how this is done with some help from past Forum topics. To hide any element, on any page, at any viewport size - could be very useful - for pushing more relevant information to smaller viewport sizes, use the code below.

@media only screen and(max-width: 768px){
.div class of element goes here{ display: none;}
}

Cheers,
Esteban


#3

Hello Esteban,

It’s great that you figured it out by yourself and thanks for sharing a solution!

Please feel free to ask any other questions that you might have in future.

Kind Regards, Roman.


#4

Hello.

Not sure if I should open a new topic on this subject but for some reason the code that was working yesterday is now not working. I had added this code yesterday, to eliminate the blue wire button on the top slider at 768px and any pixel resolution lower than this.

@media only screen and(max-width: 768px){
.panel-row-style-down-scroller-row.down-scroller-row.panel-row-style{ display: none;}
}

I was looking at my site today and noticed that the blue wire button was there. Very strange. Any ideas would be great to re-fix my problem.

Thank you,
Esteban


#5

…and now it is working again. Ghosts in the machines. Sorry - false alarm.


#6

Hello Esteban,

Thank you for letting me know that it is working again.

It could be a caching issue.

Kind Regards, Roman.