To comply to HTML best practices, and guarantee mobile support, all our themes are developed using absolutely NO TABLES. When in content areas, divs do not behave as table cells, and do not expand their width when content is larger than a pre-defined div width.
Some approaches are possible, to address this issue.
Increase page width
You can increase global page width to accommodate all content items. This can be done by adding the following code to the bottom of the theme's .css file:
@media (min-width: 1200px) { .container, .navbar-fixed-top .container { width: 95% !important; } } .IE7 .container, .IE8 .container { width:95% !important; }
Set tables not to expand
For this approach you can try adding the following code to the bottom of the theme's .css file:
table.ms-listviewtable { table-layout: fixed; }
Add horizontal scroll
Add the following css instead, to set content area to have a horizontal scroll
@media (min-width: 992px) { #bt-content { overflow-x:auto; } }
Comments