I see a lot of excellent advice here regarding how to build mobile-responsive data tables. However, when it comes to large viewports, I'm not finding much. In general, I'm lost about what could be the solutions for my problem explained below. This is a mockup of the view I'm working on. On a ~1200px wide viewport, the table is centered in the page. Below are my concerns:
- The section titles are aligned to the left. But when I align them to the data table, it seems there is excessive white space on the page.
- Furhtermore, the page is to check server statuses. The table displays various servers, their status (icon), and a description. There's also a legend at the top that tells the user what each icon stands for.
- The first 'Lorem Ipsum' section may have 1 or more cards of server alerts data. The below mockup is what it would look like with no current alerts.
I would like to get suggestions on -
Do I center the section headers to align with the data table? Should the info text section below the header be aligned in the center or to the left?