Jump to content

FF 1.5.0.4 Breaks CSS File


SharkBait

Recommended Posts

This is the error I get when I look at one of my sites on my test machine via the JavaScript Console in FireFox:

[!--quoteo--][div class=\'quotetop\']QUOTE[/div][div class=\'quotemain\'][!--quotec--]
Error: The stylesheet [a href=\"http://tyswebserver/testsite/includes/styles.css\" target=\"_blank\"]http://tyswebserver/testsite/includes/styles.css[/a] was not loaded because its MIME type, "text/html", is not "text/css".
Source File: [a href=\"http://tyswebserver/testsite/index.php\" target=\"_blank\"]http://tyswebserver/testsite/index.php[/a]
Line: 0
[/quote]

Now this is the CSS file (I'm still learning how to do CSS properly so please bare with me):

[code]
/****************************************
MAIN CSS FILE
/****************************************/

body {
    margin: 0;
    padding: 0;
    background-color: #ddd;
}

a:link, a:visited, a:hover, a:active {
    color: #00f;
    text-decoration: none;
}

a:hover {
    color: #000;
}
a:active {
    color: #00f;
}

#maincontainer {
    width: 800px;
    border: none;
    text-align: left;
}

p.login {
    font-size: 12px;
    padding-left: 5px;
}

.username {
    padding: 0;
    margin: 0;
    font-weight: bold;
    color: #f00;
}

#leftnav {
    width: 160px;
    padding: 0;
}

#title {
    margin: 10px 5px;
}

.navcontainer {
    float:left;
    border: 1px solid #000;
    color: #fff;
    font-weight: bold;
    text-align: center;
    background-image: url(../graphics/cell1.gif);
    margin: 5px;
    width: 150px;
}

.header {
    border: 1px solid #000;
    margin: 10px 5px;
    background-image: url(../graphics/cell1.gif);
    margin-left: 150px;
}

.navsub {
    background-color: #fff;
    color: #000;
    text-align:left;
    font-weight: normal;
    padding: 5px;
}

#leftnav ul {
    margin: 0;
    padding: 0;
    list-style-type: none;
}

#notes {
    margin: 0;
    padding: 0;
    font-size: 120%;
}
#notes ul li {
    list-style-type: none;
    font-weight: bold;
}

#notes ul li ul li {
    font-size: 90%;
    font-weight: normal;
}

h2 {
    color: #00f;
    text-align: center;
}
.error {
    color: #ff0000;
    font-weight: bold;
    font-size: 105%;
    text-align: center;
}

.rowOne {
    background-color: #ddd;
}
.rowTwo {
    background-color: #eee;
}

.topmenu {
    background-color: #fff;
    font-weight: normal;
    text-align: left;
    padding: 0;
    margin: 0;
    padding-left: 2px;
}
.topmenu ul {
    list-style-type: none;
}
.topmenu ul li a {
    color: #00f;
}
.topmenu ul li a:hover {
    color: #000;
}
.title_header {
    border: 1px solid #000;
    color: #fff;
    font-weight: bold;
    text-align: center;
    background-image: url(../graphics/cell1.gif);
    margin: 0;
}
#testlinks {
    margin-top: 5px;
}
#testlinks ul {
    padding: 0;
    margin: 0;
    color: #000;
    font-size: 10pt;
}
#testlinks table td a {
    margin: 0;
    padding: .5px;
    display: block;
    border-bottom: 1px solid #000;
    border-right: 1px solid #000;
    border-top: 1px solid #aaa;
    border-left: 1px solid #aaa;
    text-align:center;
}
#testlinks table td a:hover {
    background-color: #ccc;
    border-bottom: 1px solid #aaa;
    border-right: 1px solid #aaa;
    border-top: 1px solid #000;
    border-left: 1px solid #000;
}

#footer {
    clear:both;
}
[/code]

IE 7 (and 6) loads the CSS without issues. Anyone know a) my CSS is correct andor b) This is a bug with the latest update with FireFox?

I did run the CSS throught the CSS Validator and this is what came up:

[!--quoteo--][div class=\'quotetop\']QUOTE[/div][div class=\'quotemain\'][!--quotec--]
To work as intended, your CSS style sheet needs a correct document parse tree. This means you should use valid HTML.
[/quote]

Though what am I doing that isnt valid HTML?

In my header.html file I have this to get my css file.
[code]
    <link rel="stylesheet" type="text/css" href="includes/styles.css" />
[/code]

I'm stuck and need help! :)

Thanks





Link to comment
Share on other sites

If your <link rel="stylesheet" type="text/css" href="includes/styles.css" /> in the head section of the HTML and the file name styles.css (no styles.php or anything else), it should work fine.

If you have this live somewhere, I can check it out for you.
Link to comment
Share on other sites

This is the HTML that is called (require("includes/header.html")) in the line 0 of the index.php

[code]
<?php

session_start();
$sessid = session_id();
header("Cache-control: private");   // IE6 Fix for Sessions

ob_start();

$mtime = microtime();
$mtime = explode(' ', $mtime);
$mtime = $mtime[1] + $mtime[0];
$startime = $mtime;

if (!isset($page_title)) {
    $page_title = QC Test Site';
}

error_reporting(E_ALL ^ E_NOTICE);

require_once('mysql_connect.php');
require('includes/funcs.inc');
require('includes/defs.php');

   // Check User Messages via MySQL
$NEWMSGS = FALSE;

$msgqry = "SELECT * FROM messages WHERE Receipient = '{$USERNAME}'";
$mysql = mysql_query($msgqry);

$msgFound = mysql_num_rows($mysql);

$newMsgQry = "SELECT * FROM messages WHERE Receipient = '{$USERNAME}' AND Viewed = 'N'";
$NewQuery = mysql_query($newMsgQry);

$numNewMsg = mysql_num_rows($NewQuery);

if ($numNewMsg > 0) {
    $NEWMSGS = TRUE;
}

?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>

<title>
    <?php
        echo $page_title;
    ?>
</title>

    <link rel="stylesheet" type="text/css" href="includes/styles.css" />
    
    <?php
    if ($NEWMSGS && isset($USERNAME)) {
        ?>
    <script language="Javascript">
        function popUP() {
            mywindow= window.open ("newmsg.php", "mywindow","location=0,status=0,scrollbars=0,width=200,height=50");
            mywindow.moveTo(0,0);
        }
    </script>
        <?php
    }
    ?>
</head>

<body>
<?php
if (!isset($USERNAME)) {
?>
<div style="background-color: #36c; color: #fff; padding: 5px;">
    <form action="login.php" method="post" style="padding:0; margin:0;">
        Username: <input style="font-size: 90%;" type="text" name="username" size="20" value="<?php if (isset($username)) echo $username; ?>" />
        Password: <input style="font-size: 90%;" type="password" name="password" size="20" /><input style="font-size: 90%;" type="submit" name="submit" value="Login" />
    </form>
</div>
<?php
}
?>
<div id="maincontainer">
    <?php
    if(isset($USERNAME)) {
        
    ?>
    <div class="navcontainer">
        <?php
        if ($USERNAME) {
            echo "Logged In As:";
        } else {
            echo "Please Login";
        }
        ?>
        <div class="topmenu"><br />
            <?php
            if(isset($USERNAME)) {
                echo "<span class=\"username\">{$USERNAME}</span>";
            }
            ?>
            <span class="username" style="padding-left: 10px; text-align: right;">
                [ <a href="logout.php">Logout</a> ]
            </span>
            <br />&nbsp;
        </div>
    </div>
    <?php
    }
    if ($USERLEVEL == $ADMIN) {
    ?>
    <div class="navcontainer">
        Administation
        <div class="topmenu">
            <ul class="topmenu">
                <li><a href="phpMyAdmin" target="_blank">phpMyAdmin</a></li>
                <li><a href="users.php">User List</a></li>
                <!-- <li><a href="rma_dump.php">Dump RMA entries</a></li> -->
                <li> &nbsp;</li>
                <!-- <li><a href="logs.php">View Logs</a></li> -->
            </ul>
        </div>
    </div>
    <?php
    }
    if ($USERLEVEL >= $TESTER) {  
    ?>
    <div class="navcontainer">
        Testing
        <div class="topmenu">
            <ul class="topmenu">
                <li><a href="add_note.php">Add a Note</a></li>
                <li><a href="test.php">Test Units</a></li>
                <li>&nbsp;</li>
            </ul>
        </div>
    </div>
    <div class="navcontainer">
        Messages
        <div class="topmenu">
            <ul class="topmenu">
                <li><a href="messages.php?viewall">View Messages</a>
                    <span align="center" style="color:#000; text-align: center;">
                        <?php echo "<font color=\"#000000\">{$numNewMsg} [ {$msgFound} ] </font> \n"; ?>
                    </span></li>
                <li><a href="messages.php?send">Send a Message</a></li>
                <li>&nbsp;</li>
            </ul>
        </div>
    </div>
    <div style="clear:both;">&nbsp;</div>
    <?php
    }    
    ?>
    <div style="float:left; width: 150px;">
    <?php
        require('nav-left.php');
    ?>
    </div>

    <div style="float: right; width: 640px;">
                <!--  CHANGABLE CONTENT HERE -->

[/code]

Its on a private network so I can't show you it in action :)

I am missing something in my header.html file?
Link to comment
Share on other sites

I figured out what it was.

In my Apache httpd.conf I have it looking for PHP in .css files

Well that would of course bugger things up. Though IE would not break, and FireFox would.

So I removed the .css extension from the httpd.conf so that it would not look for PHP and it works peachy now.

:)
Link to comment
Share on other sites

This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.