Background: For the website I am on (a roleplay forum) you are allowed to use custom css and html in posts. To do this, you have to use a [dohtml] BBCode tag. Then you can insert any css/html you wish.
Problem: Some users have used linked stylesheets to make theirs show up. And it works. But mine doesn't.
Other: I am unable to use a tag, because it's not a full html document. I am using it in the same manner, but for some reason mine is not working. Can anybody help me with this? Is there something wrong with my CSS?
<link rel="stylesheet" type="text/css" href="https://www.dropbox.com/s/23ktd8q6bdekhi8/scorix.css" />
EDIT: When someone links to this one, it works fine
<link rel="stylesheet" type="text/css" href="https://www.dropbox.com/s/w2uh6gphwjgmenu/betteralone.css?dl=1" />
The link should be a direct download link. This should work (at least, let's hope so):
https://dl.dropboxusercontent.com/s/23ktd8q6bdekhi8/scorix.css?dl=1&token_hash=AAFS1EYWJejOVo_PQ8c8RSK0rRbKC0kPt0fXEz5T7i5A7Q
Other than that, I don't see anything wrong with your HTML link code and your CSS validates flawlessly.
Related
I put my css in the public folder and linked to it in my template, but the css won't work. When I run the file out of Laravel using HTML index, it works fine. But, when I put it in Laravel it won't see the css.
This is my code in the template:
<link rel="stylesheet" href="css/style.css">
<link rel="stylesheet" href="css/media.css">
Do I need to add anything to make it blade/laravel specific?
use asset like this:
<link rel="stylesheet" href="{{asset('css/style.css')}}">
<link rel="stylesheet" href="{{asset('css/media.css')}}">
read this for more info!
Turns out, it was a browser issue. All of my css and links were correct and the files were in the correct location. It worked in Safari, but not in Firefox. I had to correct a few things on my preferences in Firefox.
can you confirm the CSS files are not reached by the browser ?
If not, maybe the css folder is not in your public folder :
public/css/style.css
This way it should works fine.
Hello I am trying to fix render blocking CSS recommendation from Google Page speed.
<style>here goes critical path</style>
<link rel="preload" as="style" media="all" href="wp-content/cache/autoptimize/css/autoptimize_fb3761d5ff1bb5dcb1bc273f35788f8e.css" onload="this.rel='stylesheet'" />
<noscript id="aonoscrcss">
<link type="text/css" media="all" href="wp-content/cache/autoptimize/css/autoptimize_fb3761d5ff1bb5dcb1bc273f35788f8e.css" rel="stylesheet" />
</noscript>
I use Autoptimize for this purpose, so I inserted critical path and checked defer CSS. However Google doesn't count this as a fixed recommendation.
From this code part, is there any issues that causing it, or it something else? Any hints on how to troubleshoot this issue?
And also Google shows 2 blocking css files with the same name and url.
Well, to be honest, I've been dealing with these kind of stuff for ages. The only thing I manage to do is to add "inline" css to all pages... Yes, it's a pain in the *ss. but after all... google is ok with it..
the solution would be to get ALL css rules for EACH page and add it as an inline-css in your html (minimized of course.)
not sure if that's the best way to go, however, that's what solved the issue for me..
cheers
With Autoptimize, you can enable the Inline all CSS? option, the problem will gone.
Your "critical css" is likely considered insufficient by GPSI #Eng80lvl, you'll have to look into that (regenerating it elsewhere or tweaking it yourself).
"inline all" fixes the "render blocking"-warning, but will (except is you have very little CSS) see GPSI complaining about "prioritize visible content" (as the amount of inlined CSS will cause your actual content to be available later, even if part of the same response).
I have been trying to get the CSS conditional comments working on MVC.(Conditional Comment below). I have been looking for the answer on google but they all seem to have the same code but working. But It doesn't seem to work for mine. Is there a problem in the code? It seems as thought it takes it as a comment. Does it not work for MVC Razor? Does it have anything to do with IE versions? If this question was already please feel free to link it for me! (Look at update)
<!--[if IE]>
<link rel="stylesheet" href="~/Content/BrowseStyle2.css" />
<![endif]-->
UPDATE
Conditional comments are not supported in IE 10. Is there another way to get IE specific Css files working or IE specific CSS classes?
It's the "~". I had the same issue. For some reason it's not being rendered on the server side, I guess since it's wrapped in IE conditional comments. You have two options:
Use the full URL of the file
Or do something like
<link rel="stylesheet" href="#Url.Content("~/Content/BrowseStyle2.css")" />
I hope that helps.
What's the "~" doing in the path to the CSS File?
the problem is that I have a css file that is pointed from my baselayout.jsp file as following, when I am in index.php it applies the css but when I move to Profile/view.jsp it does not.
when I look at the source I noticed it is looking the css file in Profile/stylesheets/Base.css rather than myproject/stylesheets/Base.css, how to point to it in a way that works on all pages.
<link href="<s:url value="/stylesheets/mycss.css"/>" rel="stylesheet"
type="text/css" />
Its a breeze, just change the address to solid address, as following
http://www.example.com/myPreoject/stylesheets/Base.css
Is it just me or does a site like:
http://www.infoq.com/news/2009/04/fubu-mvc
often load without a style, because the author put the stylesheet over on:
http://cdn1.infoq.com/styles/style.css
I know this is all trendy way to do css, image and javascript files now. But I seem to bump into this issue all the time. Is it only a Firefox issue?
I just saved the source locally and tested it out. It seems that when the styles do not appear, the LINK element is resolving as:
<link rel="stylesheet" type="text/css" media="screen" href="http://cdn3.infoq.com/styles/style.css;jsessionid=2BAD2D184D56C3163ADC70B99E711F47" />
..the important part being the ';jsessionid....' which is knocking the css out of commission.
On a reload, that jsessionid apparently kicks into action for some reason, and the LINK element resolves normally as:
<link rel="stylesheet" type="text/css" media="screen" href="http://cdn4.infoq.com/styles/style.css" />
I'm not sure what is actually causing the jsessionid to not work, then work on reload...but that seems to be the culprit in one way or another. Also, I had the same exact experience in IE7 and Safari...so definitely not a browser specific thing.
I believe the issue is because firefox checks for crossdomain.xml to see if the request is allowed, and IE just grabs it regardless.