Making grid responsive

John_Khan

Hi,

I wan to make the grid responsive and for that I have added the below bootstrap class in the div tag as given in the CSUI Sdk documentation.

<div class="binf-container-fluid">

but its not responsive. if I reduce the size of window then its creating the horizontal scrollbar instead of makin grid responsive.

Could you please let me know what I am missing and doing wrong.

Thanks in advance.

John

 

 

 

 

 

 

Ferdinand Prantl

The responsiveness has been limited to devices with their width greater than 768px. (iPad portrait mode, for example.) If you resize the web browser window to be narrower, you will get a horizontal scrollbar. If you stretch the window wider and wider, you wil see, how the grid cells change their width and unwrap to fewer rows. Make sure, that you use binf-col-sm-N, -md-N, -lg-N, -xl-N clasees to control the responsive resizing. For example:

<div class="binf-widgets">  <div class="binf-container-fluid">    <div class="binf-row">      <div class="binf-col-sm-5 binf-col-md-4 binf-col-lg-3" id="content">      ... a widget here      </div>    </div>  </div></div>

CS Smart UI has been designed only for tablet and bigger devices; not for smart phones. The widgets would look broken, if you forced them to a narrower container.

This may change in the future. We are discussing a possibility to have a subset of widgets, which would be responsive down to the narrowest devices.

Smart phone users are supposed to use the CS Mobile App. It uses a part of the framework, but the widgets are especially designed for mobile devices.