I am working on a project with work, and it requires I use CSS selectors to locate elements within a webpage. For the most part, I have had no issues using the selectors, but I am having a very strange issue which does not seem to make much sense to me. Please advise if you have any input at all.
Note, I am keeping this description at a high level for now because I believe the issue rests with the way I am using the selectors themselves and not with where they are being used (I will elaborate if and whenever necessary). Also, I have only tested on IE8 so my examples are limited to that.
The particular issue I am having is with the CSS Attribute Selectors, and it is as follows:
This is the HTML element I am attempting to locate:
Expand|Select|Wrap|Line Numbers
- <div id="ext-gen143" class="x-layer x-combo-list " style="position: absolute; z-index: 11000; visibility: visible; left: 367px; top: 317px; width: 140px; height: 76px; font-size: 11px;">
Expand|Select|Wrap|Line Numbers
- div.x-combo-list[style~='visible;']
- div.x-combo-list[style~='visibility: visible;']
In attempts to find a solution, I experimented with various combinations, and found some very strange results (this is just a subset of the combinations I tried, which I think exemplifies the scenario):
Expand|Select|Wrap|Line Numbers
- div.x-combo-list
- div.x-combo-list[class~='x-combo-list']
- div.x-combo-list[class~='x-layer']
- div.x-combo-list[class='x-layer x-combo-list ']
- div.x-combo-list[style]
- input[name]
- input[name='FIRST_NM']
- input[name='FIRST_NM'][autocomplete='off']
Expand|Select|Wrap|Line Numbers
- div.x-combo-list[style|='z']
- div[class~='x-combo-list'][style~='visible;']
- div[class~='x-combo-list'][style~='visibility: visible;']
I am not sure if my explanation will suffice, but I think I have showed the issue that I have, so any input whatsoever anyone might have would be greatly appreciated!
Thanks again,
scdowney.