ATTENTION, PLEASE READ: New topic creation is disabled, as we have moved to a new support system. Your existing topics will remain, but for all new requests you will need to use the new system. Click here to go to the new support request form.

• Back to forum

  Posted in: Dante
• February 25, 2016 at 1:28 pm #251975
  costin

  Member

  Post count: 199

  Hi,

  On the page footer I have 2 rows (with Rev Slider inside) which on mobile will transform in one per row. Is there a way please to keep 2 per row when on mobile?

  Thank you!

  February 25, 2016 at 1:39 pm #251981
  Kyle – SUPPORT

  Moderator

  Post count: 35880

  Hi

  You would need to add an extra class to the columns so I can provide some custom css

  – Kyle

  February 25, 2016 at 1:45 pm #251987
  costin

  Member

  Post count: 199

  I’ve added .rows

  Thank you!

  February 25, 2016 at 1:46 pm #251988
  Kyle – SUPPORT

  Moderator

  Post count: 35880

  Please change it to .mobile-2col

  – Kyle

  February 25, 2016 at 1:48 pm #251989
  costin

  Member

  Post count: 199

  Done

  February 25, 2016 at 1:50 pm #251990
  Kyle – SUPPORT

  Moderator

  Post count: 35880

  Add this to your custom css:

  @media only screen and (max-width: 479px) { 
  .mobile-2col.col-sm-6 {
    width: 50%;
    float: left;
  }
  }

  – Kyle

  February 25, 2016 at 1:59 pm #251995
  costin

  Member

  Post count: 199

  Looks fine, thank you! How can I reduce the space between the 2 rows?

  I’ve just noticed that, even though I’ve deleted the “click the edit button to change this text.” from Icon Box, it’s still there. How can I remove it please?

  February 25, 2016 at 2:22 pm #252006
  Kyle – SUPPORT

  Moderator

  Post count: 35880

  Try adding padding 0 so:

  @media only screen and (max-width: 479px) { 
  .mobile-2col.col-sm-6 {
    float: left;
    padding: 0;
    width: 50%;
  }
  }

  For the icon box it has to have content. To hide it add the extra class no-content to the icon boxes then add this custom css:

  .no-content .sf-icon-box-content {
    display: none;
  }

  – Kyle

  February 25, 2016 at 2:40 pm #252015
  costin

  Member

  Post count: 199

  I would like to reduce the space/gap between the 2 rows/lines but it seems that the code provided is reducing the space between 1st and 2nd and 3rd and 4th. Is there another css I can use please?

  The code for icon box doesn’t work unfortunately. I would like to use it only for that specific box as in other I do have content. Would it be possible please?

  Thank you!

  February 25, 2016 at 2:44 pm #252019
  Kyle – SUPPORT

  Moderator

  Post count: 35880

  1) Add this

  .spb_slider_widget {
    margin-bottom: 0;
  }

  2) Did you add the extra class to your icon box?

  – Kyle

  February 25, 2016 at 2:53 pm #252020
  costin

  Member

  Post count: 199

  1) no change…

  2) sorry, works now. On desktop it’s perfect but on mobile I have a big gap between the icon box and next content. How can I reduce it only on mobile?

  February 25, 2016 at 2:55 pm #252022
  Kyle – SUPPORT

  Moderator

  Post count: 35880

  @media only screen and (max-width: 479px) { 
  .mobile-2col.col-sm-6 {
    float: left;
    width: 50%;
    margin-bottom: 0;
  }
  }

  – Kyle

  February 25, 2016 at 3:26 pm #252033
  costin

  Member

  Post count: 199

  1) Works now

  2) The space below the icon box with “Discover our destinations” is created by a divider of 30px and looks OK on desktop. If I remove it the icon box will have a margin 0 on bottom. But on mobile, at this moment the space is too big. Is there a way to reduce it please?

  Thank you!

  February 25, 2016 at 3:45 pm #252038
  Kyle – SUPPORT

  Moderator

  Post count: 35880

  Add this inside your media query:

  .spb_icon_box.no-text {
    margin-bottom: 0;
  }
  

  – Kyle

  February 25, 2016 at 3:55 pm #252041
  costin

  Member

  Post count: 199

  Perfect, thank you very much! I appreciate highly your speed of response.

  As my support will expire in just a few days, could you please have a look at another topic which is unsolved and maybe you can help me.

  Related products not working

  I’ve also provided the login details…

• Back to forum

  Posted in: Dante