CSS file not showing up in styles tab.

4,725 views
Skip to first unread message

Kelicia Christianson

unread,
Feb 6, 2014, 3:42:05 PM2/6/14
to google-chrome-...@googlegroups.com
Something in the dev tools changed after the last chrome update which is making my usual workflow a bit difficult.

It seems like the file that some styles are being applied from is nowhere to be found in the elements pane, network pane, or sources pane. I know the styles are coming from a file called content.css but it isn't showing up anywhere. I think this might be a bug.

The styles aren't user agent, inline or inspector styles. They are in an external css file which isn't showing up anywhere in dev tools.

Any advice for getting that data to show again is much appreciated. 


Thanks!

Vsevolod Vlasov

unread,
Feb 7, 2014, 2:43:16 AM2/7/14
to Google Chrome Developer Tools
How is this stylesheet added to the page?
Is it a static <link href="..."> tag or a dynamically created <style> element?
This might happen if you add a stylesheet using a dynamically created <style> element without sourceURL.


--
You received this message because you are subscribed to the Google Groups "Google Chrome Developer Tools" group.
To unsubscribe from this group and stop receiving emails from it, send an email to google-chrome-develo...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/google-chrome-developer-tools/b70877c6-77b9-4583-89d6-ef76a4d93b44%40googlegroups.com.
For more options, visit https://groups.google.com/groups/opt_out.

Patrick Mueller

unread,
Feb 6, 2014, 5:12:17 PM2/6/14
to google-chrome-...@googlegroups.com
Usually takes me a while to figure out, but I'm learning.  It's usually a Chrome extension :-)


--
You received this message because you are subscribed to the Google Groups "Google Chrome Developer Tools" group.
To unsubscribe from this group and stop receiving emails from it, send an email to google-chrome-develo...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/google-chrome-developer-tools/b70877c6-77b9-4583-89d6-ef76a4d93b44%40googlegroups.com.
For more options, visit https://groups.google.com/groups/opt_out.



--
Patrick Mueller
http://muellerware.org

Kelicia Christianson

unread,
Feb 7, 2014, 11:36:46 AM2/7/14
to google-chrome-...@googlegroups.com
Bingo Vsevolod Vlasov! You were exactly right and I must say I feel silly for not realizing it myself since I wrote the <style> element a couple weeks ago. Going to switch it to a <link> now to make my life easier.

Thank you!!

On Friday, February 7, 2014 1:43:16 AM UTC-6, Vsevolod Vlasov wrote:
How is this stylesheet added to the page?
Is it a static <link href="..."> tag or a dynamically created <style> element?
This might happen if you add a stylesheet using a dynamically created <style> element without sourceURL.
On Fri, Feb 7, 2014 at 12:42 AM, Kelicia Christianson <kel...@gmail.com> wrote:
Something in the dev tools changed after the last chrome update which is making my usual workflow a bit difficult.

It seems like the file that some styles are being applied from is nowhere to be found in the elements pane, network pane, or sources pane. I know the styles are coming from a file called content.css but it isn't showing up anywhere. I think this might be a bug.

The styles aren't user agent, inline or inspector styles. They are in an external css file which isn't showing up anywhere in dev tools.

Any advice for getting that data to show again is much appreciated. 


Thanks!

--
You received this message because you are subscribed to the Google Groups "Google Chrome Developer Tools" group.
To unsubscribe from this group and stop receiving emails from it, send an email to google-chrome-developer-tools+unsub...@googlegroups.com.

rexen....@gmail.com

unread,
Nov 22, 2014, 7:41:36 AM11/22/14
to google-chrome-...@googlegroups.com
Same problem - Chrome Developer is not showing CSS under "Styles" tab. I have checked, and found no empty url declarations. Anyone who has dealt with this issue before ?

PhistucK

unread,
Nov 22, 2014, 10:01:14 AM11/22/14
to Google Chrome Developer Tools
Vsevolod was not referring to empty URL <link> declarations, but to dynamically added <style> tags that do not have a /*# sourceURL=foo.css*/ comment.
This is will show "foo.css" in the Styles pane -
document.head.insertAdjacentHTML("beforeEnd", "<style>body{color:blue}/*# sourceURL=foo.css*/</style>");
This will not -
document.head.insertAdjacentHTML("beforeEnd", "<style>body{color:blue}</style>");


PhistucK

On Sat, Nov 22, 2014 at 2:41 PM, <rexen....@gmail.com> wrote:
Same problem - Chrome Developer is not showing CSS under "Styles" tab. I have checked, and found no empty url declarations. Anyone who has dealt with this issue before ?

--
You received this message because you are subscribed to the Google Groups "Google Chrome Developer Tools" group.
To unsubscribe from this group and stop receiving emails from it, send an email to google-chrome-develo...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/google-chrome-developer-tools/fb405095-dc1b-427d-a62a-8c8e50ae1884%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

Jason College

unread,
Mar 23, 2017, 11:07:53 AM3/23/17
to Google Chrome Developer Tools
I have the exact same problem as the OP. My case is slightly different though.

Line from loading php file:
$css = 'main.css'; /* the name of the main css file */

Contents of main.css file:
@import url('structure.css');
@import url('skin.css');
@import url('jquery.ui.tabs.css');

The problem css file is skin.css. I can see all the code for the skin.css file in the styles tab, but the filename does not show. (See OP's screenshot)

I see no reason for this css file to do this. No other skins have this problem, and they all load CSS files the same way.
Reply all
Reply to author
Forward
0 new messages