Last week a customer indicated that layout problems could arise with list views. The problem arises when the amount of data/columns that is visible, exceeds the browser width. This creates an empty space next to the title row when the user scrolls horizontally.
After some research I found two solution to set the width of the list view to the title row.
The first solution is a CSS based and works only for IE 8, FF and Chrome. Add the following CSS code to a custom stylesheet.
The code will check if the list view width and when it is wider than the browser window width, the list view width is set to the title row.
In the code I added an array of elements to which the width needs to be set when the list view is too wide. The standard elements to which the width needs to be assigned to are the top navigation section (#s4-topheader2) and the site description section (.s4-title).