You cannot do this in inline styles:

<div class="md-display--none xl-display--block">…</div>

It's a false premise to say this is "inline CSS". Inline styles are one subset of the entire CSS world and functional classes can hold dozens of advantadges inline CSS doesn't have.