Hi, About Hide/show in Tablet - it's all based on boostrap4 and they implemented screen size detecion. Yes, it may not work perfect becuase Apple made iPads (ex. iPad Pro 10.5", iPad Pro 12.9) that have screen with resolution like used in small laptop.

So I guess, extra custom CSS is needed for some devices. More here : https://css-tricks.com/snippets/css/media-queries-for-standard-devices/

Section: Tablets - iPads

Thanks Paul.

Can you provide an example on how I can manage that? What particular css should I put?

Regards.

First I have to know about what device we are talking about. For example?

1. iPad 3, 4
2. iPad Pro 9.7"
3. iPad Pro 10,5"
4. iPad Pro 12.9"

whole rest is simple.

iPad mini 5 is the one I'm using to test the display.

Thx,

And you need to hide addon (or row?) on:

1. Portrait view
2. Landscape view
3. Both

General @Media CSS Code would be

/* ----------- iPad 1, 2, Mini and Air ----------- */
/* Portrait and Landscape */
@media only screen 
  and (min-device-width: 768px) 
  and (max-device-width: 1024px) 
  and (-webkit-min-device-pixel-ratio: 1) {
    HERE EXTRA CUSTOM CSS
}

Short guide for iPad Mini (older):

1. Inside addon settings - CSS Class - insert name: ipadhide
2. Inside template custom CSS area put below code

@media only screen 
  and (min-device-width: 768px) 
  and (max-device-width: 1024px) 
  and (-webkit-min-device-pixel-ratio: 1) {
.sppb-addon.ipadhide  
{display: none !important; visibility: hidden;}
}

3. Clear Sarafi browser cache or refresh screen 2-3x to see effect

For newer models of iPads

@media only screen 
  and (min-device-width: 768px) 
  and (max-device-width: 1024px) 
  and (-webkit-min-device-pixel-ratio: 2) {
    .sppb-addon.ipadhide  
{display: none !important; visibility: hidden;}
}

Thanks Paul,

I will try all of these if I understand it correctly.

Regards.

You can use both custom CSS syntax. So more devices would be included.

If you use Helix based template - read how to use custom CSS here >> https://www.joomshaper.com/documentation/helix-framework/helixultimate/custom-code

1. Added to your custom.css
2. Now add class name into selected addons
3. Remember to clean mobile/tablet cache to load new file