User agent stylesheet is overriding my css even though it acknowledges it shouldn't?

Question

I've scoured the internet (and Stack Overflow) searching for a solution to this simple problem, but to no avail.

The user agent stylesheet is telling me that it's being overridden by my styles, but is still applying it's own. Take a look:

Original code snippet:

Here, it shows clearly that the original display:block; is being overridden, as it should be.

,

Yet here, under the computed tab, it is still applying display:block. The container is set to display:table.

I isolated the effected elements in scratch html/css files, and there is no problems with overriding the user agent stylesheet there, as can be seen here:

.

What on earth could be causing this? Thanks in advance.

Also, !important doesn't work.

Edit: All of the screenshots decided to embed themselves overnight so it looked like a total mess, which is fun. Rather than delete this question out of embarrassment, I just cleaned that up real fast, although it's still pretty convoluted-looking but whatever.

Answer 1

Looking at your screenshot of the element's computed styles, I notice that its float is set to left. Floating an element tends to blockify it, and in the case of a table-row, that does indeed turn it into a block and ultimately detach it from its table container, as a table-row cannot normally be floated. This is not a case of the UA stylesheet overriding your styles, but how the display and float properties interact.

In order for a table layout to work you cannot float any of its internal table elements, including row groups, rows, and cells. (You can float the table itself.) As I am not familiar with your layout I won't be able to suggest a proper and complete answer to your question, but the key here is to remove the float declaration from that element. Since this declaration doesn't appear in your own styles it must be elsewhere — look for it among the rest of the element's styles. If necessary, override it using float: none.

(There may of course be other factors causing this blockification that as others have mentioned require a proper reproduction of your problem to diagnose, but this is what I could glean from just the screenshots you've provided and is a very common and likely cause.)