7 {{ upvoteCount | shortNum }}
7 {{ upvoteCount | shortNum }}

Where should I place the CSS code into "styles.css"?

by taskemann
6 replies
  • WEB DESIGN
    • |
Hi! I want to place a video skin / frame on my sales page and in the instructions it says: "copy/paste the CSS code in styles.css into your stylesheet."

But where should I place the CSS code into the "styles.css"? Can I place it enywhere, or must it be placed in a specific place on the file?


I hope you understand what I mean.


Thanks,

Jimmy
#code #css #place #stylescss
  • Profile picture of the author Istvan Horvath
    This is what I do when I have to add new code to a theme's stylesheet:

    /*---- this is the code for ***** gizmo ---*/

    COPY CODE HERE
    /*--- end *** gizmo code ---*/

    Whatever is in between /* and */ is considered "commented out" in CSS, so the browsers will not interpret it but you keep your stuff organized.

    Oh, and probably, the best place is to add it just at the end of the file; i.e. not mixing with the original code.
    Signature

    {{ DiscussionBoard.errors[5215800].message }}
  • Profile picture of the author taskemann
    Ok, so the code should be something like this? :


    /*---- this is the code for ***** gizmo ---*/

    @charset "UTF-8";
    /* CSS Document */

    .frame720x405 {
    background-image: url(720x405.jpg);
    height: 443px;
    width: 741px;
    margin-top: 0px;
    margin-right: auto;
    margin-bottom: 0px;
    margin-left: auto;
    padding-top: 18px;
    padding-left: 19px;
    }

    /*--- end *** gizmo code ---*/
    {{ DiscussionBoard.errors[5215839].message }}
    • Profile picture of the author AnniePot
      As Istvan suggests, place it at the end of your current file.

      Using this same method, I always insert a clear divider, separating my customized additions from the original code, this makes it easy to refer back to my own customizations later. (Of course, you wont always be able to do this for simple changes to font sizes, etc.)
      {{ DiscussionBoard.errors[5216341].message }}
      • Profile picture of the author Joe Mobley
        Jimmy,

        Be aware that any updates to your theme or a change in themes may, and probably will wipe out any changes to the .css file.

        I just keep a copy on my computer.

        Joe Mobley
        Signature

        .

        Follow Me on Twitter: @daVinciJoe
        {{ DiscussionBoard.errors[5216763].message }}
  • Profile picture of the author RobKonrad
    This

    /*---- this is the code for ***** gizmo ---*/

    /*--- end *** gizmo code ---*/

    is not to be taken literally - it's just an annotation for you to find the code, so you can replace it with something you will remember like /* I CHANGED THE CODE HERE */ in case you have to replace it at some point.

    Cheers,
    Rob Konrad
    Signature
    ================================================== ===
    This blog is awesome: http://www.robkonrad.com/blog. Read it.
    ================================================== ===
    {{ DiscussionBoard.errors[5216937].message }}
  • Profile picture of the author taskemann
    Ok, thanks everyone! I followed the steps that you guys gave me, and it worked!

    Thanks,

    Jimmy
    {{ DiscussionBoard.errors[5216959].message }}

Trending Topics