Page ignores style sheet but reads same style in the header - css

This page doesn't get the table styles from the style sheet. If I put the same styles in the page itself, they are applied. What could cause this? The css file name is correct and is read by other pages.
<!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>Pagelinks | Known Issues</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
<link rel="stylesheet" type="text/css" href="pagelinks_windows.css" />
<!-- style>
#known_issues th, #known_issues td {
font-size: 13px;
text-align: left;
}
</style -->
</head>
<body>
<h1>Known Issues</h1>
<p>
Known bugs and issues are listed here.</p>
<table id="known_issues">
<tr><th>Tracking No.</th><th>Category</th><th>Description</th><th>Status</th><th>Workaround</th></tr>
<tr><td>plt001</td><td>Site</td><td>Site navigation broken on Internet Explorer 8</td><td>Closed</td><td>None. That browser version has a major bug involving javascript objects. Users must upgrade to Internet Explorer 9.</td></tr>
<tr><td>plt002</td><td>Site</td><td>Saints and feasts do now show description</td><td>Open</td><td>None. The description data for the Saints and the feasts is being compiled.</td></tr>
</table>
<br/>
<br/>

Test if the content of the css file is visible.
Try to open it in the browser.
Common possible error when letters-case (A\a and so on) in file-names differs - this willn't work on *nix hosting servers, ever if it worked localy on windows.
Another common situation: when is error in path to file from current file-directory.

Are your stylesheets in the same root directory as this html file? Common practice is to put stylesheets, js, includes, etc into different directories. Perhaps you follow this convention and simply forgot href="css/pagelinks_windows.css"? Hard to find the answer to your problem without much more information but it's usually something small you're missing. One of those that you end up with a forehead-slap once you find it :)

What does your stylesheet look like?
I think you might have some conflicting css, try adding your table style at the VERY bottom of pagelinks_windows.css

Related

Why CSS is not working on my github pages?

I'm trying to deploy my react app on github as pages but the css isn't working. Im attaching my github repository if anyone can help.text.
As right now the page is looking totally messed cause not css is applied.
cLooking at generated index.html file in the gh-pages branch, I can see that the file is malformed; you have missing closing tags in your HTML.
// index.html (I added newlines for readability)
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8"/>
<link>font-family: "Montserrat", sans-serif; href="https://fonts.googleapis.com/css?family=McLaren|Montserrat&display=swap" rel="stylesheet"
<link>rel="stylesheet" href="./styles.css"
...
Notice the link tags aren't closed. Because of this, the CSS file will not be loaded by the browser.

IE11 will not load external css from intranet

IE11 will NOT load external css from the intranet - at all. Internal css works fine. In-line css works fine. External CSS works fine on the Internet. Everything works fine in other browsers - everywhere!
When I open C:\Users\hennesse\Desktop\test.html (below) by either right-clicking and openWith->IE - or- typing into the IE location bar, I get two alerts: "internal javascript", and "external javascript" - then:
the first line is NOT red
the second line is blue
the third line is green
However, if I upload this to my web server, and open it with IE, the first line IS red. With Firefox and Chrome, the first line is ALWAYS red, intranet or internet.
For some reason, IE11 will not load the external CSS file on "My Computer".
Changing security settings in Internet Options->Security->Allow Active Content to run in My Computer (and rebooting) results in a prompt (or not) about Allow Active Content? But the results are the same.
This is driving me insane! -Dave
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Test Page</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link rel="stylesheet" type="text/css" href="test.css">
<!--
external file test.css contains:
body { color: #ff0000 }
-->
<style type="text/css">
.blue {
color: blue;
}
</style>
<script type="text/javascript">
alert("internal javascript");
</script>
<script type="text/javascript" src="test.js">
// external file test.js contains
// alert("external javascript");
</script>
</head>
<body>
This should be red, but it isn't
<p class="blue">
This is blue
</p>
<p style="color:green">
This is green
</p>
</body>
</html>
In the F12 console, I found: SEC7113 "CSS was ignored due to mime type mismatch". Discussion here: 1 [MSDN]. It seems that IE9 and above "sniff" the HTTP headers for the correct MIME type, and ignore JS and CSS that have the wrong header. When it fetches files from the local filesystem, it should disable this sniffing, since there aren't any real HTTP headers.
But my particular computer is sniffing and ignoring anyway. I've searched and searched, but the mighty Internet has only yielded one other person who has this problem. She solved it by reloading the operating system. I'm not gonna do that!
I very seldom use IE for anything except a final compatibility check after I've loaded stuff to a server. Except for one personal "extension" to a Windows app that invokes IE on the user's computer. Since I'm the only using it, I just hit F12, and select IE8 mode (this shows it's the IE9-up MIME sniffing). It works fine, and since it only costs me a couple mouse clicks, it sure beats reloading the OS.
Although I didn't really solve the problem, perhaps the "sniff and ignore" info can help someone else do so. OCHI - thanks for your help.
-Dave

Internet Explorer css Error

My tutorial site works fine on google chrome but when i try to open it with any kind of internet explorer i can not see some part of visul items.
All information of my design exist in css file. However being gray of right part can be observed but on the other hand i can't see navigation bar.
I put my some codes. It is high possible to have any link between these code and this situation.
At the beginning:
<!-- InstanceBegin template="/Templates/tempPage00.dwt" codeOutsideHTMLIsLocked="false" --><!doctype html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<!-- InstanceBeginEditable name="doctitle" -->
<html>
<title>Tutorials</title>
...
<link href="styles/mainStyle.css" rel="stylesheet" type="text/css">
For more you can check: http://www.soccerforecast.com/Tutorials/SFUnderCons/currentForecasts.php
I don't have 10 reputation so i can't put direct image to this site so link is: http://postimage.org/image/y94bk7afb/
I don't usualy control my site with different kind of browser, now i recommend to do this everyday. Now i don't have any idea which code make this situation. :)
Yout HTML is a little messed up.
Fix these things and it might help:
Place your HTML tag before the HEAD tag but after the DOCTYPE tag.
Place a closing HTML tag at the very end of your document.
In the TABLE you have towards the end of your page you have an extra closing TR tag.
The comment before your DOCTYPE will possibly cause problems too.
Try running your site through a validator to check for errors like these.
HTML: http://validator.w3.org/
CSS: http://jigsaw.w3.org/css-validator/
It's because you have a comment before your doctype declaration.
This is forcing the page into quirks mode if you remove that comment you should be ok.
<!-- InstanceBegin template="/Templates/tempPage00.dwt" codeOutsideHTMLIsLocked="false" -->
<!doctype html>
<head>
Edit... The head and html tags are the wrong way round also.

CSS not linking to xHTML

though I have visited this site many times, this is my first question.
After hours of google-foo to no avail, I cannot get my stylesheet to link.
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd”>
<html xmlns=”http://www.w3.org/1999/xhtml” lang=”en” xml:lang=”en”>
<head>
<title>Newb Development</title>
<link type=“text/css” rel="stylesheet" href=”\master.css” />
</head>
<body>
<img src="banner.gif" alt="NewbDev Logo" title="Newb Development" />
<h1>Welcome To NewbDev.com</h1>
<h2>Under Construction</h2>
<p>
As you can see, we are currently under construction. Upon completion
of the website you will be able to follow a fellow newb developer
on his journey to <em>programming masterification!</em>
</p>
</body>
The file "master.css" is in the same directory. I have tried it on the computer and via the server and my styles are not applying. I know I do not have to style sheet posted here but it's nothing fancy and I'm positive the contents of stylesheet are not the issue.
The file "master.css" is in the same directory.
So you should have href="master.css" not href="/master.css" or href="\master.css".
Also note the quotes, you need " or ' not ”. (You might need to zoom in to see the difference):
" ' ”
A validator would pick up that last problem.
You don't use backslash in URL's.
Try this instead, if your CSS-file is available at the root:
<link type="text/css" rel="stylesheet" href="/master.css" />
Since your master.css is in the same directory just use:
<link type=“text/css” rel="stylesheet" href=”master.css” />
If that doesn't work make sure it is saved as a css file.

IE6 PNG-transparency CSS hack not working

I looked around and decided to use a CSS approach rather than rely on JS... I figure the kind of corporate users stuck with IE6 might also have JS disabled by IT departments.
So In my HTML I have:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
<title>My Page</title>
<link rel="stylesheet" type="text/css" href="default.css" />
<!--[if IE 6]><link rel="stylesheet" type="text/css" href="ie6.css"><![endif]-->
</head>
<body>
<img src="media/logo.png"/>
</body>
Then my ie6.css consists simply of:
img
{
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(...);
}
However none of this makes the slightest difference, no transparency. I commented out all the rest of the page so it is literally that one and still no luck. I removed the default.css stylesheet and still no difference.
EDIT:
I now got it working, using the .htc method, loading that file in a conditional IE6 test block. It turned out the problem I was having was that Windows 7 had 'locked' the file (I don't even know what this means) and this blocked IE from loading/using it.
If I'm not mistaken, you must use
progid:DXImageTransform.Microsoft.AlphaImageLoader(src='yourimage.png')
for every and each image, you can't make it just work for all images.
I am using the solution of following page: IE PNG support
Following the online demonstration online demonstration step by step, your pngs will be transparent also in IE.
In the HTML page you have the path to the image relative to the HTML file (media/logo.png) in the default.css you have an entry with behavior: url(iepngfix.htc); (path to the iepngfix.htc is relative to the HTML file) and in the ie6.css you have an entry with filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='media/logo.png', sizingMethod='scale'); with the path to the image relative to the CSS file. And at least you need to change the path in the iepngfix.htc (IEPNGFix.blankImg = 'media/blank.gif';)
You need to have following folder structure:
HTML file
iepngfix.htc
ie6.css
default.css
/media/logo.png
/media/blank.gif
You would probably like to take a look at http://www.dillerdesign.com/experiment/DD_belatedPNG/
It also allows you to use pngs with alpha-channel with CSS background-position property, which you can't usually, when using AlphaImageLoader.

Resources