Using a CSS stylesheet in PHP










1














Writing a simple PHP website and having trouble linking the stylesheet to the page. In the past I've had issues with this but usually it ends up working.



Anything wrong with my code? Or am I just doing it wrong?



<head>
<title>San Joaquin Valley Town Hall</title>
<link href="styles/main.css" media="screen" rel="stylesheet" type="text/css" />
<link rel="stylesheet" href="styles/normalize.css">
</head>`


(I am using a XAMPP server to run my files)



Thanks










share|improve this question























  • Have you seen here for correct syntax: w3schools.com/css/css_howto.asp
    – Frederik
    Nov 12 '18 at 19:12










  • Rather that add your code as a comment, please edit the question. It makes it easier to read.
    – Alien Technology
    Nov 12 '18 at 19:13










  • Are both of your stylesheets not loading, or just one? Have you checked the browser's console for errors?
    – j08691
    Nov 12 '18 at 19:32















1














Writing a simple PHP website and having trouble linking the stylesheet to the page. In the past I've had issues with this but usually it ends up working.



Anything wrong with my code? Or am I just doing it wrong?



<head>
<title>San Joaquin Valley Town Hall</title>
<link href="styles/main.css" media="screen" rel="stylesheet" type="text/css" />
<link rel="stylesheet" href="styles/normalize.css">
</head>`


(I am using a XAMPP server to run my files)



Thanks










share|improve this question























  • Have you seen here for correct syntax: w3schools.com/css/css_howto.asp
    – Frederik
    Nov 12 '18 at 19:12










  • Rather that add your code as a comment, please edit the question. It makes it easier to read.
    – Alien Technology
    Nov 12 '18 at 19:13










  • Are both of your stylesheets not loading, or just one? Have you checked the browser's console for errors?
    – j08691
    Nov 12 '18 at 19:32













1












1








1


1





Writing a simple PHP website and having trouble linking the stylesheet to the page. In the past I've had issues with this but usually it ends up working.



Anything wrong with my code? Or am I just doing it wrong?



<head>
<title>San Joaquin Valley Town Hall</title>
<link href="styles/main.css" media="screen" rel="stylesheet" type="text/css" />
<link rel="stylesheet" href="styles/normalize.css">
</head>`


(I am using a XAMPP server to run my files)



Thanks










share|improve this question















Writing a simple PHP website and having trouble linking the stylesheet to the page. In the past I've had issues with this but usually it ends up working.



Anything wrong with my code? Or am I just doing it wrong?



<head>
<title>San Joaquin Valley Town Hall</title>
<link href="styles/main.css" media="screen" rel="stylesheet" type="text/css" />
<link rel="stylesheet" href="styles/normalize.css">
</head>`


(I am using a XAMPP server to run my files)



Thanks







php html css






share|improve this question















share|improve this question













share|improve this question




share|improve this question








edited Nov 12 '18 at 19:17

























asked Nov 12 '18 at 19:09









mn11

183




183











  • Have you seen here for correct syntax: w3schools.com/css/css_howto.asp
    – Frederik
    Nov 12 '18 at 19:12










  • Rather that add your code as a comment, please edit the question. It makes it easier to read.
    – Alien Technology
    Nov 12 '18 at 19:13










  • Are both of your stylesheets not loading, or just one? Have you checked the browser's console for errors?
    – j08691
    Nov 12 '18 at 19:32
















  • Have you seen here for correct syntax: w3schools.com/css/css_howto.asp
    – Frederik
    Nov 12 '18 at 19:12










  • Rather that add your code as a comment, please edit the question. It makes it easier to read.
    – Alien Technology
    Nov 12 '18 at 19:13










  • Are both of your stylesheets not loading, or just one? Have you checked the browser's console for errors?
    – j08691
    Nov 12 '18 at 19:32















Have you seen here for correct syntax: w3schools.com/css/css_howto.asp
– Frederik
Nov 12 '18 at 19:12




Have you seen here for correct syntax: w3schools.com/css/css_howto.asp
– Frederik
Nov 12 '18 at 19:12












Rather that add your code as a comment, please edit the question. It makes it easier to read.
– Alien Technology
Nov 12 '18 at 19:13




Rather that add your code as a comment, please edit the question. It makes it easier to read.
– Alien Technology
Nov 12 '18 at 19:13












Are both of your stylesheets not loading, or just one? Have you checked the browser's console for errors?
– j08691
Nov 12 '18 at 19:32




Are both of your stylesheets not loading, or just one? Have you checked the browser's console for errors?
– j08691
Nov 12 '18 at 19:32












3 Answers
3






active

oldest

votes


















0














The link tag looks fine, however the href is relative. Is the styles directory in the same directory as your html?



If you can see your stylesheet at http://yoursite.com/styles/main.css, I would change the link to be less relative:



<link href="/styles/main.css" media="screen" rel="stylesheet" type="text/css" />


This way, no matter where your HTML page resides in the file structure, the stylesheet will be found.






share|improve this answer




























    1














    Without understanding your file structure, there isn't much else that can be said here.



    I'd recommend using a relative link from the root directory of your project. Let's say your file structure is something like:



    [website]
    [resources]
    [styles]
    [images]
    [js]
    ...


    Then you're style include would be something like:



    <link rel="stylesheet" href="/resources/styles/my_sheet.css" media="screen" type="text/css"/>


    This is personal preference, as I'm not a fan of using directory traversal .. or . to find files. In my experience, files end up moving around a bit (we develop our own framework, so things are always changing) so with this we're sure exactly where the file is located just by viewing the href.






    share|improve this answer




























      0














      HTML media Attribute



      Read the page that was recommended and after reading, try this:



      <head>
      <title>San Joaquin Valley Town Hall</title>
      <link rel="stylesheet" type="text/css" href="styles/main.css" media="screen">
      <link rel="stylesheet" type="text/css" href="styles/normalize.css">
      </head>


      if the next problem is the directory, try this:



      <head>
      <title>San Joaquin Valley Town Hall</title>
      <link rel="stylesheet" type="text/css" href="/styles/main.css" media="screen">
      <link rel="stylesheet" type="text/css" href="/styles/normalize.css">
      </head>





      share|improve this answer






















        Your Answer






        StackExchange.ifUsing("editor", function ()
        StackExchange.using("externalEditor", function ()
        StackExchange.using("snippets", function ()
        StackExchange.snippets.init();
        );
        );
        , "code-snippets");

        StackExchange.ready(function()
        var channelOptions =
        tags: "".split(" "),
        id: "1"
        ;
        initTagRenderer("".split(" "), "".split(" "), channelOptions);

        StackExchange.using("externalEditor", function()
        // Have to fire editor after snippets, if snippets enabled
        if (StackExchange.settings.snippets.snippetsEnabled)
        StackExchange.using("snippets", function()
        createEditor();
        );

        else
        createEditor();

        );

        function createEditor()
        StackExchange.prepareEditor(
        heartbeatType: 'answer',
        autoActivateHeartbeat: false,
        convertImagesToLinks: true,
        noModals: true,
        showLowRepImageUploadWarning: true,
        reputationToPostImages: 10,
        bindNavPrevention: true,
        postfix: "",
        imageUploader:
        brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
        contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
        allowUrls: true
        ,
        onDemand: true,
        discardSelector: ".discard-answer"
        ,immediatelyShowMarkdownHelp:true
        );



        );













        draft saved

        draft discarded


















        StackExchange.ready(
        function ()
        StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53268597%2fusing-a-css-stylesheet-in-php%23new-answer', 'question_page');

        );

        Post as a guest















        Required, but never shown

























        3 Answers
        3






        active

        oldest

        votes








        3 Answers
        3






        active

        oldest

        votes









        active

        oldest

        votes






        active

        oldest

        votes









        0














        The link tag looks fine, however the href is relative. Is the styles directory in the same directory as your html?



        If you can see your stylesheet at http://yoursite.com/styles/main.css, I would change the link to be less relative:



        <link href="/styles/main.css" media="screen" rel="stylesheet" type="text/css" />


        This way, no matter where your HTML page resides in the file structure, the stylesheet will be found.






        share|improve this answer

























          0














          The link tag looks fine, however the href is relative. Is the styles directory in the same directory as your html?



          If you can see your stylesheet at http://yoursite.com/styles/main.css, I would change the link to be less relative:



          <link href="/styles/main.css" media="screen" rel="stylesheet" type="text/css" />


          This way, no matter where your HTML page resides in the file structure, the stylesheet will be found.






          share|improve this answer























            0












            0








            0






            The link tag looks fine, however the href is relative. Is the styles directory in the same directory as your html?



            If you can see your stylesheet at http://yoursite.com/styles/main.css, I would change the link to be less relative:



            <link href="/styles/main.css" media="screen" rel="stylesheet" type="text/css" />


            This way, no matter where your HTML page resides in the file structure, the stylesheet will be found.






            share|improve this answer












            The link tag looks fine, however the href is relative. Is the styles directory in the same directory as your html?



            If you can see your stylesheet at http://yoursite.com/styles/main.css, I would change the link to be less relative:



            <link href="/styles/main.css" media="screen" rel="stylesheet" type="text/css" />


            This way, no matter where your HTML page resides in the file structure, the stylesheet will be found.







            share|improve this answer












            share|improve this answer



            share|improve this answer










            answered Nov 12 '18 at 19:20









            Alien Technology

            974723




            974723























                1














                Without understanding your file structure, there isn't much else that can be said here.



                I'd recommend using a relative link from the root directory of your project. Let's say your file structure is something like:



                [website]
                [resources]
                [styles]
                [images]
                [js]
                ...


                Then you're style include would be something like:



                <link rel="stylesheet" href="/resources/styles/my_sheet.css" media="screen" type="text/css"/>


                This is personal preference, as I'm not a fan of using directory traversal .. or . to find files. In my experience, files end up moving around a bit (we develop our own framework, so things are always changing) so with this we're sure exactly where the file is located just by viewing the href.






                share|improve this answer

























                  1














                  Without understanding your file structure, there isn't much else that can be said here.



                  I'd recommend using a relative link from the root directory of your project. Let's say your file structure is something like:



                  [website]
                  [resources]
                  [styles]
                  [images]
                  [js]
                  ...


                  Then you're style include would be something like:



                  <link rel="stylesheet" href="/resources/styles/my_sheet.css" media="screen" type="text/css"/>


                  This is personal preference, as I'm not a fan of using directory traversal .. or . to find files. In my experience, files end up moving around a bit (we develop our own framework, so things are always changing) so with this we're sure exactly where the file is located just by viewing the href.






                  share|improve this answer























                    1












                    1








                    1






                    Without understanding your file structure, there isn't much else that can be said here.



                    I'd recommend using a relative link from the root directory of your project. Let's say your file structure is something like:



                    [website]
                    [resources]
                    [styles]
                    [images]
                    [js]
                    ...


                    Then you're style include would be something like:



                    <link rel="stylesheet" href="/resources/styles/my_sheet.css" media="screen" type="text/css"/>


                    This is personal preference, as I'm not a fan of using directory traversal .. or . to find files. In my experience, files end up moving around a bit (we develop our own framework, so things are always changing) so with this we're sure exactly where the file is located just by viewing the href.






                    share|improve this answer












                    Without understanding your file structure, there isn't much else that can be said here.



                    I'd recommend using a relative link from the root directory of your project. Let's say your file structure is something like:



                    [website]
                    [resources]
                    [styles]
                    [images]
                    [js]
                    ...


                    Then you're style include would be something like:



                    <link rel="stylesheet" href="/resources/styles/my_sheet.css" media="screen" type="text/css"/>


                    This is personal preference, as I'm not a fan of using directory traversal .. or . to find files. In my experience, files end up moving around a bit (we develop our own framework, so things are always changing) so with this we're sure exactly where the file is located just by viewing the href.







                    share|improve this answer












                    share|improve this answer



                    share|improve this answer










                    answered Nov 12 '18 at 19:15









                    Ryan

                    3019




                    3019





















                        0














                        HTML media Attribute



                        Read the page that was recommended and after reading, try this:



                        <head>
                        <title>San Joaquin Valley Town Hall</title>
                        <link rel="stylesheet" type="text/css" href="styles/main.css" media="screen">
                        <link rel="stylesheet" type="text/css" href="styles/normalize.css">
                        </head>


                        if the next problem is the directory, try this:



                        <head>
                        <title>San Joaquin Valley Town Hall</title>
                        <link rel="stylesheet" type="text/css" href="/styles/main.css" media="screen">
                        <link rel="stylesheet" type="text/css" href="/styles/normalize.css">
                        </head>





                        share|improve this answer



























                          0














                          HTML media Attribute



                          Read the page that was recommended and after reading, try this:



                          <head>
                          <title>San Joaquin Valley Town Hall</title>
                          <link rel="stylesheet" type="text/css" href="styles/main.css" media="screen">
                          <link rel="stylesheet" type="text/css" href="styles/normalize.css">
                          </head>


                          if the next problem is the directory, try this:



                          <head>
                          <title>San Joaquin Valley Town Hall</title>
                          <link rel="stylesheet" type="text/css" href="/styles/main.css" media="screen">
                          <link rel="stylesheet" type="text/css" href="/styles/normalize.css">
                          </head>





                          share|improve this answer

























                            0












                            0








                            0






                            HTML media Attribute



                            Read the page that was recommended and after reading, try this:



                            <head>
                            <title>San Joaquin Valley Town Hall</title>
                            <link rel="stylesheet" type="text/css" href="styles/main.css" media="screen">
                            <link rel="stylesheet" type="text/css" href="styles/normalize.css">
                            </head>


                            if the next problem is the directory, try this:



                            <head>
                            <title>San Joaquin Valley Town Hall</title>
                            <link rel="stylesheet" type="text/css" href="/styles/main.css" media="screen">
                            <link rel="stylesheet" type="text/css" href="/styles/normalize.css">
                            </head>





                            share|improve this answer














                            HTML media Attribute



                            Read the page that was recommended and after reading, try this:



                            <head>
                            <title>San Joaquin Valley Town Hall</title>
                            <link rel="stylesheet" type="text/css" href="styles/main.css" media="screen">
                            <link rel="stylesheet" type="text/css" href="styles/normalize.css">
                            </head>


                            if the next problem is the directory, try this:



                            <head>
                            <title>San Joaquin Valley Town Hall</title>
                            <link rel="stylesheet" type="text/css" href="/styles/main.css" media="screen">
                            <link rel="stylesheet" type="text/css" href="/styles/normalize.css">
                            </head>






                            share|improve this answer














                            share|improve this answer



                            share|improve this answer








                            edited Nov 12 '18 at 19:34

























                            answered Nov 12 '18 at 19:28









                            Lima

                            166




                            166



























                                draft saved

                                draft discarded
















































                                Thanks for contributing an answer to Stack Overflow!


                                • Please be sure to answer the question. Provide details and share your research!

                                But avoid


                                • Asking for help, clarification, or responding to other answers.

                                • Making statements based on opinion; back them up with references or personal experience.

                                To learn more, see our tips on writing great answers.





                                Some of your past answers have not been well-received, and you're in danger of being blocked from answering.


                                Please pay close attention to the following guidance:


                                • Please be sure to answer the question. Provide details and share your research!

                                But avoid


                                • Asking for help, clarification, or responding to other answers.

                                • Making statements based on opinion; back them up with references or personal experience.

                                To learn more, see our tips on writing great answers.




                                draft saved


                                draft discarded














                                StackExchange.ready(
                                function ()
                                StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53268597%2fusing-a-css-stylesheet-in-php%23new-answer', 'question_page');

                                );

                                Post as a guest















                                Required, but never shown





















































                                Required, but never shown














                                Required, but never shown












                                Required, but never shown







                                Required, but never shown

































                                Required, but never shown














                                Required, but never shown












                                Required, but never shown







                                Required, but never shown







                                這個網誌中的熱門文章

                                How to read a connectionString WITH PROVIDER in .NET Core?

                                Node.js Script on GitHub Pages or Amazon S3

                                Museum of Modern and Contemporary Art of Trento and Rovereto