Ninja Slider / Posts /

Keep Fullscreen Icon inside of slider


Love the slider! 

My only issue is I can't seem to keep the fullscreen Icon inside the slider (when not in fullscreen mode), and align it to the right of the image.

Below is my CSS:

#ninja-slider div.fs-icon {
   position: relative;
   z-index: 2;
   width: 45px;
   height: 45px;
   background: url(/images/fullscreen.png) no-repeat;
   background-size: 35px;

When the postion is relative, The fullscreen icon will sit at the top and far left of the slider, inside the main slider image. If I change it to absolute, or use any kind of positioning, such as right: 10px; it will move it to the far left, or far right of my webpage, outside of the image slider.

Any thoughts on how I can fix this?

Jake  8 years ago   viewed: 5970    

1 Answer


Your approach will not work. You can try adding this style to keep the enlarge button stay inside the image slider:

#ninja-slider.fullscreen div.fs-icon { position: absolute!important; }
Milo   8 years ago


Your name*
(Optional. Used to modify this post afterwords)
+ =  

Ask your Own Question

  • If your question is related to the topic of this post, you can post your question to this page by clicking the "Post a reply" button at left;

  • When you want to start a new page for your question: