How to style CSS role

Question

In the following HTML

the id can be accessed through #content in CSS. How do I access

Answer 1

The shortest way to write a selector that accesses that specific div is to simply use

[role=main] {
  /* CSS goes here */
}

The previous answers are not wrong, but they rely on you using either a div or using the specific id. With this selector, you'll be able to have all kinds of crazy markup and it would still work and you avoid problems with specificity.

[role=main] {
  background: rgba(48, 96, 144, 0.2);
}
div,
span {
  padding: 5px;
  margin: 5px;
  display: inline-block;
}

  Hello