Is it possible to make a widget responsive to screen size, or can this only be done via the container?

[patricklatella]

Hi all,

I'm developing a portal homepage, and on it I've got a custom widget I've created.  This widget will not be user friendly in the mobile view, so when the screen shrinks I want the widget to not be shown.  I'm seeing in docs how to control container using the "Width" and the "Parent Class" fields on the container record, however I don't want to do it this way since the container contains other OOB widgets that are fine in the mobile view.  Is it possible to add this dynamic nature directly to the widget?  Thanks!

[dvp · Accepted solution]

Use hidden-xs in top div to hide the widget in mobile screen

[patricklatella]

Hi DVP, thanks for the reply...that worked!

Is it possible to add this kind of control at the <th> or <td> level?

My custom widget has columns, and as the screen is still in tablet size I'd like the columns to go away, and then have the whole widget go away at the "hidden-xs" size, is this possible?

[dvp]

You can try something like this

<th class="hidden-xs">
or

<th class="visible-md visible-lg">

[patricklatella]

OK, I'll play around with that...it's working on the <th> level, but not the <td> level.

But thanks again, I've got the widget entirely controlled, and that was my first goal...I'll keep trying on the individual columns in the widget.