Make the header width match a custom Layout Element Content Width - Best way?

Hello,

Let's say I have a Layout Element called "NoSidebar900px" which displays a no sidebar content with a 900px width based on a display rule : tag is "NoSideBar900px".

How can I elegantly make the header match that 900px width everywhere while keeping things dynamic?

Right now the only way I've found is either by using Tom's "Simple CSS" plugin and add custom CSS to the pages using that Layout :

.grid-container{max-width:900px;}

But obviously now it's not dynamic so if I create a new page with the tag "NoSideBar900px" I would still have to add that for each page.

What's the best way to achieve this?

Thanks,