CODEWITHSUNDEEP
php
Blackie
Blackie

Reputation: 53

Unable to link external CSS into PHP

I have been facing the problem of linking a CSS file to my PHP code.

I am using Netbean IDE 7.2 and XAMPP 8.0

I have tried to create a new HTML file and link it with a new CSS file.

It does not work.

If I type the script inside the HTML itself, it works great.

What am I doing wrong?

<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
        <title>Website Development Version 1.0</title>
        <link href="CSS/layout.css" type="css/text" rel="stylesheet"/>
        <link href="CSS/expandLayout.css" type="css/text" rel="stylesheet"/>
        <script src="Javascript/jquery-1.4.2.min.js" type="text/javascript"></script>
        <script>
            function prepareList() {
                $('#expList').find('li:has(ul)')
                .click( function(event) {
                    if (this == event.target) {
                        $(this).toggleClass('expanded');
                        $(this).children('ul').toggle('medium');
                    }
                    return false;
                })
                .addClass('collapsed')
                .children('ul').hide();
            };

            $(document).ready( function() {
                prepareList()
            });
        </script>
    </head>
    <body>
        <div id="container">
            <div id="header">
                <!-- Input Content -->
                <h1>This is Header</h1>
            </div>
            <div id="menuList">
                Menu 
            </div>
            <div id="innerContainer">
                <div id="leftColumn">
                    <!-- Input Content -->
                    <ul id="expList">
                        <li>Home</li>
                        <li>Product
                            <ul>
                                <li>List 1</li>
                                <li>List 2</li>
                                <li>List 3</li>
                            </ul>
                        </li>
                        <li>Register</li>
                        <li>About Us</li>
                    </ul>
                </div>
                <div id="centerColumn">
                    <!-- Input Content -->
                    This is Main Content
                </div>
                <div id="rightColumn">
                    <!-- Input Content -->
                    This is Right Content
                </div>  
            </div>
            <div id="footer">
                <!-- Input Content -->
                <h3>This is Footer</h3>
            </div>
        </div>
    </body>
</html>

Upvotes: 0

Views: 142

Answers (1)

Quentin
Quentin

Reputation: 943142

The media type for CSS is text/css not css/text.

Browsers tend to ignore <link>s to things with media types they don't understand.

Upvotes: 2

Related Questions