0
Welcome Guest! Login
0 items Join Now

SOLVED Slideshow spacer

Last Post
Search Topic

  • SOLVED Slideshow spacer

    Posted 9 years 7 months ago
    • Hi,
      When I reduce the width of the screen, a gap between the slideshow and the main content of the home page appear. How can I improve this ?

      Site : www.touartube.com/TAT

      Thanks,
      Steven
    #1233731
    • MrT's Avatar
    • MrT
    • Preeminent Rocketeer
    • Posts: 101084
    • Thanks: 13484
    • Web Designer/Developer

    Re: SOLVED Slideshow spacer

    Posted 9 years 7 months ago
    • Remove the custom CSS that you added forcing that space (see screenshot). I suspect that what you need to do is to actually vary that height according to the viewport size, so your CSS need to be put into media queries with different values according to the viewport.
      /* Smartphones */
@media (max-width: 594px) {
 
}
   
/* Smartphones to Tablets */
@media (min-width: 595px) and (max-width: 882px) {

}
    
/* Tablets */
@media (min-width: 883px) and (max-width: 1074px) {

}
     
/* Desktop */
@media (min-width: 1075px) and (max-width: 1314px) {

}
     
/* Large Display */
@media (min-width: 1315px) {

}


      Regards, Mark.
    • Please search forums before posting. Please make sure your post includes the version of the CMS you are using and a link to the problem. Annotations on screenshots can also be helpful to explain problems/goals. Please use the "secure" tab for confidential information.
    #1233768

  • Re: SOLVED Slideshow spacer

    Posted 9 years 7 months ago
    • Yes, I added this custom CSS
      #slideshow-spacer {
      height: 380px !important;
      }
      because that's what DanG from the rockettheme forum said me to do in a previous topic in order to erase the space between my slideshow and the main content.

      So if I understood correctly, I remove this custom CSS and I replace this by your customm CSS ????

      Steven
    #1233818
    • MrT's Avatar
    • MrT
    • Preeminent Rocketeer
    • Posts: 101084
    • Thanks: 13484
    • Web Designer/Developer

    Re: SOLVED Slideshow spacer

    Posted 9 years 7 months ago
    • Please replace that statement with this:
      @media (max-width: 594px) {
  #slideshow-spacer { height: 70px ! important; }
  .rt-body-top {
    margin: -130px 0 0;
  }
}

@media (min-width: 595px) and (max-width: 882px) {
  #slideshow-spacer { height: 70px ! important; }
}

@media (min-width: 883px) and (max-width: 1074px) {
  #slideshow-spacer { height: 210px ! important; }
}

@media (min-width: 1075px) and (max-width: 1314px) {
  #slideshow-spacer { height: 290px ! important; }
}

@media (min-width: 1315px) {
  #slideshow-spacer { height: 380px ! important; }
}

      Regards, Mark.
    • Please search forums before posting. Please make sure your post includes the version of the CMS you are using and a link to the problem. Annotations on screenshots can also be helpful to explain problems/goals. Please use the "secure" tab for confidential information.
    #1233933

  • Re: SOLVED Slideshow spacer

    Posted 9 years 5 months ago
    • Thanks.
    #1247125
    • MrT's Avatar
    • MrT
    • Preeminent Rocketeer
    • Posts: 101084
    • Thanks: 13484
    • Web Designer/Developer

    Re: SOLVED Slideshow spacer

    Posted 9 years 5 months ago
    • btw - I just noticed that your subscription has recently expired. Please note that support does require a current subscription.

      Regards, Mark.
    • Please search forums before posting. Please make sure your post includes the version of the CMS you are using and a link to the problem. Annotations on screenshots can also be helpful to explain problems/goals. Please use the "secure" tab for confidential information.
    #1247131

Time to create page: 0.069 seconds