Not Showing CSS Rules for Inspected Element

[trista...@gmail.com]

As my subject line states I'm not seeing the CSS rules for some elements. I can't seem to find a reason. The CSS I'm writing is being applied to the element, but Chrome show nothing in the styles pane. I think it may have something to do with how deeply nested they are, but I can't say for sure. Any help would be appreciated.

[PhistucK]

Any code, sample, reduced test case, or a link, would be useful in order to help you.

☆PhistucK

[trista...@gmail.com]

I'm trying to get a demo somewhere of the code without showing off too much of the project. Curiously, when I've broken the nav in question off onto it's own page it's working fine.

I'll see what I can do about a proper demo.

Thanks for the reply.

[Alexander Pavlov]

On Tue, Mar 20, 2012 at 10:04 PM, <trista...@gmail.com> wrote:

As my subject line states I'm not seeing the CSS rules for some elements. I can't seem to find a reason. The CSS I'm writing is being applied to the element, but Chrome show nothing in the styles pane. I think it may have something to do with how deeply nested they are, but I can't say for sure. Any help would be appreciated.

Do you by chance have a property somewhere, saying background-image: url(); or background: url(); or something similar with an empty url() expression?

You can also try inspecting the DevTools window (press Ctrl-Shift-J when one is in focus) and see if there are any errors in the console.

--
-alexander

[trista...@gmail.com]

I don't seem to have any empty url() expressions, and I see nothing in the console besides what we've dumped there as we build.

I tried to inspect the DevTools window but I couldn't seem to do it. Pressing Ctr-Shift -J just seemed to bring up the window with the console open and nothing new. I feel like I didn't grasp what you meant though because I never felt like I was inspecting the Dev Tools window itself.

I can also report at this point that the style rules do appear just fine in Firebug and in IEs developer tool.

I'm going to work more on it tomorrow and if I can find a point where I can make something live I'll do so promptly.

[PhistucK]

By the way, when you expand "Computed style" and look up the property that is not showing up within "Styles", do you see the value for which you are looking?

If so, expand the property to trace its style, does it show the rule/file/line that does not show up within "Styles"?

Also, is it a rule for :hover, :focus, :active or :visited? These might not show up if you do not enable them using the middle button (between the plus sign and the cog wheel) on the title bar of the "Styles" pane.

☆PhistucK

[trista...@gmail.com]

It does show up in the computed section! And it is showing the correct line of code in the CSS.

It isn't a pseudo class of any kind, though this morning it started showing the padding and margin, but the color, line-height, font weight and size, as well as a few others aren't showing still (though to reiterate they are showing under Computed Styles).

[John A.]

Just as a note for all, removing empty url() instances from my CSS
file fixed this issue for me on Chrome 18. Thanks!

On Mar 20, 5:46 pm, Alexander Pavlov <apav...@chromium.org> wrote:

> On Tue, Mar 20, 2012 at 10:04 PM, <tristan.z...@gmail.com> wrote:
> > As my subject line states I'm not seeing the CSS rules for some elements.
> > I can't seem to find a reason. The CSS I'm writing is being applied to the

> > element, but Chrome show nothing in the styles pane. I *think* it may

> > have something to do with how deeply nested they are, but I can't say for
> > sure. Any help would be appreciated.
>

> Do you by chance have a property somewhere, saying *background-image: url();
> * or *background: url();* or something similar with an empty *url()*

[trista...@gmail.com]

Sorry I've been out of touch on here regarding the problem, I've been busy with the site in question and a few others at the same time so I haven't had much time to try to trouble shoot it. I can say that is only one site and only in Chrome. We've made quite a few changes to the site and it still does it. It is kind of a wacky site with a lot of fancy stuff happening with jQuery and a lot of elasticity which means a lot of relative/absolute positioning and I assume one of those things is confusing something.

As I work on it I'm checking it out, and if I can seem to find something that makes a quantifiable difference I'll post back in here.

Thanks again to everyone who has responded. It's not often you get any response in most forums, let alone actual help, so I say again, thank you.

[eric....@gmail.com]

removing all instances of url("") did the trick for me too