We're redesigning our a page of our web-based application after complaints that this particular page was too data-dense. The page currently has 6 filters at the top and a data table with 10 columns. Each row is clickable, and when clicked a pop-up modal displays that contains additional information about that row.
The table needs to stay as we've also heard complaints when we did a big overhaul a few months back of our interface. The main change we are making is shortening the table with to 5 columns, and displaying the other 5 columns worth of information below the row.
How can I best display the information below the row given that the information should always be visible to the user?
I attached a Balsamiq mockup of the page. http://imgur.com/358lLiZ The timestamp, alert type, etc... would be the table headings and are fixed at the top. The image, and all the text in the whitespace to the right of that is the information I need to display below the row.