• Visitors can check out the Forum FAQ by clicking this link. You have to register before you can post: click the REGISTER link above to proceed. To start viewing messages, select the forum that you want to visit from the selection below. View our Forum Privacy Policy.
  • Want to receive the latest contracting news and advice straight to your inbox? Sign up to the ContractorUK newsletter here. Every sign up will also be entered into a draw to WIN £100 Amazon vouchers!

Reply to: CSS error

Collapse

You are not logged in or you do not have permission to access this page. This could be due to one of several reasons:

  • You are not logged in. If you are already registered, fill in the form below to log in, or follow the "Sign Up" link to register a new account.
  • You may not have sufficient privileges to access this page. Are you trying to edit someone else's post, access administrative features or some other privileged system?
  • If you are trying to post, the administrator may have disabled your account, or it may be awaiting activation.

Previously on "CSS error"

Collapse

  • Bunk
    replied
    Originally posted by SimonMac View Post
    All the css is located in /wp-content/themes/scalia/css/
    Ah, and if the SVG is located at /wp-content/themes/scalia/css/grayscale.svg, then you want to change

    Code:
    filter: url('css/grayscale.svg#greyscale');
    to

    Code:
    filter: url('grayscale.svg#greyscale');

    Leave a comment:


  • SimonMac
    replied
    All the css is located in /wp-content/themes/scalia/css/

    Leave a comment:


  • FrontEnder
    replied
    That's odd.

    Relative URLs in CSS are relative to the stylesheet, so placing any images etc that are needed relative to the stylesheet is common practice.

    What's the path of the CSS file? If 'css/grayscale.svg' is showing as 'http://mywebsite/css/grayscale.svg' in the browser, then it looks like it's in your site root.

    It should really be in the theme folder, with the svg file you need relative to that.

    Leave a comment:


  • Bunk
    replied
    The path to the SVG file is relative to the location of the CSS file, so "filter: url('css/grayscale.svg#greyscale');" would indicate that in the same folder as the CSS file there is another "css" folder containing the SVG file. Is that correct?

    Leave a comment:


  • SimonMac
    replied
    Originally posted by FrontEnder View Post
    Just move the 'grayscale.svg' file into the same folder as the css file.
    Won't work as one of the "folders" that it is trying to refer to is actually a page, also don't want to have to have a single file dotted around the website multiple times just fix some CSS

    Leave a comment:


  • FrontEnder
    replied
    Just move the 'grayscale.svg' file into the same folder as the css file.
    Last edited by FrontEnder; 10 May 2016, 08:10.

    Leave a comment:


  • eek
    replied
    Originally posted by SimonMac View Post
    Calling all code monkeys, need some help!

    Got a wordpress theme that is causing me grief, the bit in the style.css file is

    Code:
    .grayscale {
    	-webkit-filter: grayscale(100%);
    	-moz-filter: grayscale(100%);
    	-ms-filter: grayscale(100%);
    	-o-filter: grayscale(100%);
    	filter: grayscale(100%);
    	filter: url('/themes/scalia/css/grayscale.svg#greyscale');
    It seems this is being translated into

    http://mywebsite/css/grayscale.svg#greyscale

    but also as

    http://mywebsite/page/css/grayscale.svg#greyscale

    both of these locations are invalid causing 404 errors which lock the user out of the site.

    on the server the path is

    /wp-content/themes/scalia/css/grayscale.svg

    I assume I could hard code the full link, but is there a better way?
    From memory its the above. You can't use relative urls but need to explicitly specify it from the websites root

    Leave a comment:


  • SimonMac
    started a topic CSS error

    CSS error

    Calling all code monkeys, need some help!

    Got a wordpress theme that is causing me grief, the bit in the style.css file is

    Code:
    .grayscale {
    	-webkit-filter: grayscale(100%);
    	-moz-filter: grayscale(100%);
    	-ms-filter: grayscale(100%);
    	-o-filter: grayscale(100%);
    	filter: grayscale(100%);
    	filter: url('css/grayscale.svg#greyscale');
    It seems this is being translated into

    http://mywebsite/css/grayscale.svg#greyscale

    but also as

    http://mywebsite/page/css/grayscale.svg#greyscale

    both of these locations are invalid causing 404 errors which lock the user out of the site.

    on the server the path is

    /wp-content/themes/scalia/css/grayscale.svg

    I assume I could hard code the full link, but is there a better way?

Working...
X