This project is read-only.

Responsive page layout probleme when content is too large

Feb 1, 2014 at 7:42 PM
when you use the responsive page layout it does not 'wrap' the content when it is too large.

let say you put 2 webpart list side by side. when the first list is too large (when it have a lot of columns displayed) the list overflow on the second list that is on its right.

I can understand that behavior since webpart zone generate html table.
when you add simple content like text, images and that kind of stuff it worked great.
The problem is, you do not know what kind of what part users will add to the page...
(custom webpart, lists etc..)

any ideas how to solve this?
Feb 6, 2014 at 12:00 AM

Yup, one of the bigger pains of RWD and SP.

tables by default have a display of "table", i.e. not block. Display: table allows the element to expand beyond the bounds of its parent container, i.e. the responsive column.

The easiest fix is to set the parent container overflow to auto or hidden. auto will add inline scrollbars and hidden will hide the extra table content. Neither are preferable.

My preferred solution is so more of responsive table solution such as footable or a solution provided by Erik Swanson ([]