If I read the specification correctly, no.
You can match on an element, the name of an attribute in the element, and the value of a named attribute in an element. I don't see anything for matching content within an element, though.
Answer from Dean J on Stack Overflow Top answer 1 of 16
640
If I read the specification correctly, no.
You can match on an element, the name of an attribute in the element, and the value of a named attribute in an element. I don't see anything for matching content within an element, though.
2 of 16
301
Looks like they were thinking about it for the CSS3 spec but it didn't make the cut.
:contains() CSS3 selector http://www.w3.org/TR/css3-selectors/#content-selectors
Top answer 1 of 5
1
Hi Andrey, It looks like the W3C Selectors Level 3 specification recommends using the following selector instead of the :contains pseudo-class: [att*=val] Represents an element with the att attribute whose value contains at least one instance of the substring "val". If "val" is the empty string then the selector does not represent anything. It works in TestComplete.
2 of 5
0
Hi Andrey, There are special methods in TestComplete that allow searching for the target object based on CSS selectors. Refer to the "Finding Web Objects Using CSS Selectors" article for more information.
selenium - A way to match on text using CSS locators - Software Quality Assurance & Testing Stack Exchange
1 CSS Selector using ':contains' fails with `invalid element state: Failed to execute 'querySelector' on 'Document: is not a valid selector'` 12 Is jQuery faster than CSS/Xpath selectors for IE 8.0 in Selenium1? 5 Selenium - Find exact text match using CSS locators More on sqa.stackexchange.com
CSS attribute selector to find any word/text in a page and apply CSS.
Unfortunately there's no CSS selector for text content, as CSS can only select the elements on a page, not the text nodes on a page. The clue, in this instance, is in the name - it's an attribute selector - it only selects things via attributes, and text nodes don't have any! To do what you're after will require some javascript to wrap your target nodes in a HTML tag that can then be selected through your CSS; if it's part of a search feature then I would recommend the element . More on reddit.com
11
13
March 15, 2023CSS selector for all elements with same text content
Just give them all an “.edit” class More on reddit.com
27
1
October 28, 2024CSS selector (id contains part of text) - Stack Overflow
I have a question. I have elements something like this: element with id = someGenerated Some:Same:0:name element with id = someGenerated Some:Same:0:surname element... More on stackoverflow.com
Videos
Learn :has and :contains CSS Selectors
15:50
18. Playwright Made CSS Selector Powerful? Pseudo Class | has-text ...
11:21
#53. Basic CSS Selectors | Using ID, Class, Attributes | Starts ...
29:41
#7 - Locators (ID, ClassName, Text, CSS Selector, XPath) in ...
09:31
How To Use contains, starts-with, ends-with Methods in CSS Selector ...
How To Use contains, starts-with, ends-with Methods in CSS ...
ScrapingBee
scrapingbee.com › webscraping-questions › css_selectors › how-to-select-html-elements-by-text-using-css-selectors
How to select HTML elements by text using CSS Selectors? | ScrapingBee
There used to be a way to select HTML elements by text using CSS Selectors by making use of :contains(text). However, this has been deprecated for a long time and is no longer supported by the W3C standard. If you want to select an element by ...
Top answer 1 of 6
27
css=a[text='Log Out'] or a[innertext='Log Out']
Can you please try this one out?
Or if that doesn't work and you still don't want to use xpath because it's slow, you can always try: link=Log Out. That's still better then xpath.
EDIT:
So i found a possible solution for you mate. If you are trying to find an exact String you could always use Regular expression like this:
css=div:contains("^ab$")
Just replace div with a and there you go. This will find ONLY AB in whatever text div it looks for. OFC if you have more then one links with text AB (which is a bad thing :P ) then it will find them all..
Try this and see if it helps. :)
2 of 6
4
This is a nice place for a few CSS selectors.
http://net.tutsplus.com/tutorials/html-css-techniques/the-30-css-selectors-you-must-memorize/
Thought it might be useful for people following this thread.
Siteimprove
help.siteimprove.com › support › solutions › articles › 80001043350-non-standard-css-selectors-that-can-be-used-in-policy
Non-standard CSS selectors that can be used in Policy
October 18, 2022 - If you don’t want to specify which element(s) to match, you can leave out the element and search for just :contains("text"). That matches the element(s) that contains the string “text” and every ancestor element all the way up to body, which can make it almost useless. This selector is the same as :contains("text") above, but it’s case-insensitive.
W3Schools
w3schools.com › cssref › css_selectors.php
CSS Selectors Reference
The attribute selector selects HTML elements with a given attribute set. ... If you want to use W3Schools services as an educational institution, team or enterprise, send us an e-mail: sales@w3schools.com · If you want to report an error, or if you want to make a suggestion, send us an e-mail: help@w3schools.com · HTML Tutorial CSS Tutorial JavaScript Tutorial How To Tutorial SQL Tutorial Python Tutorial W3.CSS Tutorial Bootstrap Tutorial PHP Tutorial Java Tutorial C++ Tutorial jQuery Tutorial
Reddit
reddit.com › r/css › css attribute selector to find any word/text in a page and apply css.
r/css on Reddit: CSS attribute selector to find any word/text in a page and apply CSS.
March 15, 2023 -
Hey guys,
I can't seem to remember what the CSS selector or CSS in general that lets you apply CSS to a particlar word or phrase on a document. Not a class per say but anywhere the word or phrase may be.
For example, wherever it may say "Do not apply" or "achtung" font-weight:700 ; text-decoration: underline;
I've done it a while back but I can't recall.
Thanks in advance.
Top answer 1 of 5
13
Unfortunately there's no CSS selector for text content, as CSS can only select the elements on a page, not the text nodes on a page. The clue, in this instance, is in the name - it's an attribute selector - it only selects things via attributes, and text nodes don't have any! To do what you're after will require some javascript to wrap your target nodes in a HTML tag that can then be selected through your CSS; if it's part of a search feature then I would recommend the element .
2 of 5
3
I consider myself somewhat of a CSS wizard and I'm pretty sure there's no (current) ability to do this. Have to either wrap the text you want in a tag before render via template or server side processing or use JS in the browser to do the same. You can select the first letter and first word I believe but I haven't needed to use that one in a bit so don't quote me.
GeeksforGeeks
geeksforgeeks.org › css › is-there-any-selector-for-elements-containing-certain-text-in-css
Is there any selector for elements containing certain text in CSS ? - GeeksforGeeks
July 23, 2025 - Example 2: In this example the CSS [attribute~=value] selector is used to target elements with a specific attribute containing a word, such as title~=gfg1, which colors GFG2 red.
Codemia
codemia.io › knowledge-hub › path › is_there_a_css_selector_for_elements_containing_certain_text
Is there a CSS selector for elements containing certain text?
Enhance your system design skills with over 120 practice problems, detailed solutions, and hands-on exercises
Reddit
reddit.com › r/css › css selector for all elements with same text content
r/css on Reddit: CSS selector for all elements with same text content
October 28, 2024 -
I have buttons on a page with the same text content "Edit".
What CSS selector to use to style them all?
Here is an example...
<button onclick="o('10178','e')">Edit</button>
<button onclick="o('6915','e')">Edit</button>
<button onclick="o('2800','e')">Edit</button>I tried this, but it didn't work...
button[text()='Edit']
TutorialsPoint
tutorialspoint.com › article › is-there-any-selector-for-elements-containing-certain-text-in-css
Is there any selector for elements containing certain text in CSS?
October 1, 2024 - To select elements containing certain text in CSS, we can use CSS attribute selectors. We can either use pre-defined attribute or we can add custom attribute in the HTML document.
Techgrind
techgrind.io › home › explain › is there a css selector for elements containing certain text?
Is there a CSS selector for elements containing certain text? | Techgrind.io
January 3, 2025 - No built-in CSS feature exists for selecting or styling elements purely by their text content. :contains() is a jQuery (or similar library) extension, not a CSS selector.
Google Groups
groups.google.com › g › selenium-users › c › SEMa-ytXgYs
Text in CSS selector
May 26, 2023 - One can use Javascript to do that search (querySelectorAll + text) Protractor has cssContainingText.js for long time .
MDN Web Docs
developer.mozilla.org › en-US › docs › Web › CSS › Reference › Selectors › Attribute_selectors
Attribute selectors - CSS - MDN Web Docs
The CSS attribute selector matches elements based on the element having a given attribute explicitly set, with options for defining an attribute value or substring value match. ... /* <a> elements with a title attribute */ a[title] { color: purple; } /* <a> elements with an href matching ...
Playwright
playwright.dev › other locators
Other locators | Playwright
January 22, 2023 - For example, css=article >> text=Hello captures the element with the text Hello, and *css=article >> text=Hello (note the *) captures the article element that contains some element with the text Hello.
Top answer 1 of 3
196
Try this:
a[id*='Some:Same'][id$='name']
This will get you all a elements with id containing
Some:Same
and have the id ending in
name
2 of 3
69
<div id='element_123_wrapper_text'>My sample DIV</div>
The Operator ^ - Match elements that starts with given value
div[id^="element_123"] {
}
The Operator $ - Match elements that ends with given value
div[id$="wrapper_text"] {
}
The Operator * - Match elements that have an attribute containing a given value
div[id*="123_wrapper"] {
}
Repeato
repeato.app › home › using css selectors to locate elements by exact text
Using CSS Selectors to Locate Elements by Exact Text - Repeato
June 21, 2022 - This script locates elements containing the specified text by first selecting the parent and then searching for the child element. For those using Selenium, the By.LINK_TEXT locator is a practical alternative to CSS selectors for finding elements by their exact text:
Packtpub
subscription.packtpub.com › book › programming › 9781849515740 › 1 › ch01lvl1sec16 › locating-elements-using-text
Locating Elements | Selenium Testing Tools Cookbook
CSS selectors provide the contains() pseudo-class which can be used to see if an element contains the specified text.
jQuery
api.jquery.com › contains-selector
:contains() Selector | jQuery API Documentation
October 1, 2024 - The matching text can appear directly within the selected element, in any of that element's descendants, or a combination thereof. As with attribute value selectors, text inside the parentheses of :contains() can be written as a bare word or surrounded by quotation marks.
WICG
discourse.wicg.io › t › text-content-css-value-akin-to-attr › 629
Text-content() CSS value akin to attr()
January 27, 2022 - I was wondering if there was a way you could target an element with a style based on its own text content. Now a few notes about this, you want to scope the element the closest to the content you’re searching. Since tags can contain other tags, if there’s any tag inside your HTML element and you write the rule for @element 'html' {} it will come back true. Likewise if you scoped the * wildcard selector, this rule would be true for every parent element containing an element that contained the test you were searching.