CODEWITHSUNDEEP
htmlcsshtml-tablehide
Marcus Aurelio
Marcus Aurelio

Reputation: 153

Hiding a table element that has no class or id

I have a table element generated by a webpage, I need to set the display to none. However, the table element doesn't have an id or a class associated with it. This is what I am left with:

<table role="presentation" data-name="personal">

Does anyone have any ideas on how I can hide this? I have Tried over the last week but it is out of my skillset.

I should also add that I have several other tables on the page. The only distinguishable characteristics are the 'data-name="personal"' seem to be different, therefore I could possibly target the data-name, but unsure how to do achieve this.

Upvotes: 1

Views: 103

Answers (3)

Shamy
Shamy

Reputation: 25

Read about CSS Attribute Selector for more details.

Your case relating to [attribute="value"] Selector, so you can do the following:

Using data-name attribute:

table[data-name="personal"] {
	display:none;
}

Or using role attribute:

table[role="presentation"] {
	display:none;
}

Upvotes: 1

Ayubhai Shah
Ayubhai Shah

Reputation: 97

Below are some examples you can try.Replace the Attribute exists with display: none;

[data-value] {
/* Attribute exists */
}

[data-value="foo"] {
/* Attribute has this exact value */
}

[data-value*="foo"] {
/* Attribute value contains this value somewhere in it */
}

[data-value~="foo"] {
/* Attribute has this value in a space-separated list somewhere */
}

[data-value^="foo"] {
/* Attribute value starts with this */
}

[data-value|="foo"] {
 /* Attribute value starts with this in a dash-separated list */
}

[data-value$="foo"] {
/* Attribute value ends with this */
}

Upvotes: 0

Ehsan
Ehsan

Reputation: 12969

Try this:

table[data-name="personal"] {
  display:none;
}

Upvotes: 2

Related Questions