Problemn tablet design

Hi there,

your product carousel has left and right buttons. On tablet view they are sitting outside the content which is creating horizontal overflow on the page. You should raise the issue with the carousel plugin developer.

But a simple fix would be to remove the on tablet with this CSS:

@media(max-width: 1024px) {
  .atw_slider_controls {
    display: none;
  }
}

Thank you very much!

And dou you know the problom befote slider? In mobile and pc it looks great, but in table there is a space there, I don't know why.

Hi Jose,

The gap is from elementor, but I couldn't locate where exactly the issue coming from, you could try this CSS to hide the gap:

  @media (min-width: 768x) and (max-width: 1024px) {
        .home .elementor-widget-wrap {
         margin-top: -37px;
    }
}

Let me know :)

Nothing has changed!

This is the same issue we resolved here:

https://generatepress.com/forums/topic/header-slider-revolution/#post-1525024

But its no longer working as the remove-margin CSS Class has been moved from the Text Widget to the Section. Move the class back to the text widget to fix that.

I don't know why, but it is not working in tablets...

I have changed the CSS, and nothing.

Your CSS is broken - in your additional CSS you have this:

@media(max-width: 500px) {
    .mobile-navigation {
        position: fixed;
        bottom: 0;
        left: 0;
        width: 100%;
        z-index: 10000;
    }
    body {
        margin-bottom: 0px!important; /* change this value to height of mobile nav */
    }
}
} /* Remove this bracket */

It has an additional bracket ( i have commented ) that needs removing.

Then you need to make sure there are NO COLUMN Gaps on your Elementor section for Tablet devices.

I thin that I don't have any column gap on my elementor section, I don't know where the probem can be.

I suggest you ask Elementor Support as they will be able to explain how to make those changes better than i can.

I don't know why, but let's see if you can help me. In my store page, both the mobile version and the pc version show the products, but the tablet version does not show them. Could you tell me if I have any code that does this in CSS or something like that?

I know the page is build by elementor, but I think I has to be a CSS problem o something like that.

https://corteastur.es/tienda/

Where are you seeing the images missing ? I checked the site across desktop, tablet (iPad) and Mobile and on all devices the images are being displayed ?