I want to align two grids side by side, one left, one right. How to do it?
Hello Luis,
It is important to note that at their most basic the grids are simply divs with content. You can position them on the page using CSS just like you would any other div. That said, to have two grids side by side you can target the grids' containers and set display to inline-block. This will put the grids next to each other, though they will wrap if the screen width is too small to display both grids.
If you would like to prevent that wrapping effect then create another div that contains both of your grids. For this element, add a style that sets white-space: nowrap. In addition, you'll want to modify your previous style that targets the grids to add in white-space: normal to prevent some weird styling due to style inheritance:
<style type="text/css"> .ui-iggrid { display: inline-block; white-space: normal; }
#gridsContainer{ white-space: nowrap; } </style>
Please let me know if I may be of any further help with this.
Does the approach I suggested meet your requirements?