如何使用CSS属性选择器来定位特定高度？

Question

So basically, I want to only style the first specific box on my site.

I would like to try and use an attribute selector to target height (trust me, there was no other way of styling this, I literally tried everything).

I have tried the following (along with many other variations):

.first_child[style='height: 299px;']:first-child  {
background-color: red;
}

.clear[style='height: 299px;']:first-child  {
background-color: red;
}

.first_child:first-of-type [height='299px;'] {
background-color: red;
}

Although, I just can't seem to get it working.

Is this fixable, or am I attempting the impossible?

Below is a screenshot of my HTML structure if needed:

Answer 1

Try *= instead of just =, and make sure of exact text match. That said, it's a very bad idea. Try something else:

#content div.columns div.clear:first-child > div.child:first-child {}

Answer 2

.clear:first-child .child:first-child {
   background-color: red;
}