How do I combine IDs and component types in a CSS selector?

Hi:

I've got a question regarding selectors in the CSS style sheet.

I've got a series of selectors for table elements, but I'd like to have them associated with a specific table ID.

Consider the following code snippet:

table.tableSection {
  display: table;
  width: 100%;
}
table.tableSection thead, table.tableSection tbody {
  float: left;
  width: 100%;
}

table.tableSection tbody {
  overflow: auto;
  height: 150px;
}

table.tableSection tr {
  width: 100%;
  display: table;
  text-align: left;
}

Open in new window

How would I accomplish this?

Thanks,
JohnB

CSSHTMLJavaScript

Last Comment

jxbma

8/22/2022 - Mon

leakim971

12/8/2013

As you know, the selector for class is : .
the selector for ID is : #

Please note unlike CLASS attribute value, each ID attribute value MUST be unique in a document/page.

jxbma

12/8/2013

ASKER

Thanks, but your missing the point.
I know how to select via id, class and element types.

In the code snippet I submitted, I want to apply those style attributes to element types of a specific table.

So, I want to know how to COMBINE selectors for IDs and element types.

JB

Scott Fell

12/8/2013

table#MyTable.tableSection {
  display: table;
  width: 100%;
}
table#MyTable.tableSection thead, table.tableSection tbody {
  float: left;
  width: 100%;
}

table#MyTable.tableSection tbody {
  overflow: auto;
  height: 150px;
}

table#MyTable.tableSection tr {
  width: 100%;
  display: table;
  text-align: left;
}
<table id="MyTable" class="tableSection">
<tr><td>stuff</td></tr>
</table>