Menu
Here is the head of my .html file:
<html xmlns="http://www.w3.org/1999/xhtml" > <head> <link href="http://fakedomain.com/smilemachine/html.css" rel="stylesheet"/> <title>Common Questions</title> <script language="javascript"> function show(name) { document.getElementById(name).style.display = 'block'; } </script> </head> And my html.css file is indeed where it should be. But I'm getting absolutely no styling whatsoever.
Okay, so now I'm just trying to fix the problem locally on my machine. Here is the head:
<html xmlns="http://www.w3.org/1999/xhtml" > <head> <link href="cover.css" rel="stylesheet" type="text/css"/> <title>Common Questions</title> <script language="javascript"> function show(name) { document.getElementById(name).style.display = 'block'; } </script> </head> and now the css:
BODY { font-size: 18pt; color:#000fff; font-family: Helvetica; margin: 0 9 9 9; } table { font-size: 8pt; color:#525252; font-family: Helvetica; margin: 0px; border-collapse: separate; } th { font-size: 10pt; text-align: left; color:#550055; font-family: Helvetica; border-color: #999; border-width: 0 0 1px 0; border-style: dotted; } td { font-size: 10pt; text-align: left; color:#550055; font-family: Helvetica; border-color: #999; border-width: 0 0 1px 0; border-style: dotted; } .left { display:inline-block; font-size: 10pt; color:#990055; font-family: Helvetica; margin: 0 0 5 0; } .right { display:inline-block; font-size: 18pt; font-weight: bold; float: right; color:#525252; font-family: Helvetica; margin: 0px; } .question { display:inline-block; font-size: 18pt; font-weight: bold; float: right; color:#B452CD; font-family: Helvetica; margin: 0px; } Okay I've made some progress. The firebug suggestion was really good. I saw that the link to the CSS file was being read as Chinese characters. This was UTF encoding problem so I just opened my files in a text editor and then saved them as UTF-16.
But now it is reading the wrong data from the css file! I have uploaded the css file below, but in firebug it is showing a two liner.
522
Make sure the link tag is at the right place If you put the <link> tag inside another valid header tag like <title> or <script> tag, then the CSS won't work. The external style CAN be put inside the <body> tag, although it's recommended to put it in the <head> tag to load the style before the page content.
Make sure that your CSS and HTM/HTML files use the same encoding ! If your HTM/HTML files are encoded as UNICODE, your stylesheet has to be as well. IE and Edge are not fussy : stylesheets are rendered regardless of the encodings. But Chrome is totally intolerant of unmatched encodings.
When your HTML and CSS files are not on the same folder, you might have some challenges linking them. You can resolve this problem by: Using the correct file path to the CSS file. So if the CSS file is in a different folder from the HTML path, you need to identify the path name and add it to the link href value.
Regenerating CSS: This can easily be fixed by going to WP admin > Elementor > Tools > Regenerate CSS. Then, you can clear the cache (WP cache and browser cache) and refresh the page. Clearing Site Cache: Check if you have any caching plugins on your site or any server level caching enabled. Clear those caches.
Are you sure the stylesheet is loaded? You can see it using the "Net" tab of Firebug on firefox, or on "Network" tab of the Console of your browser.
(If 1 works) can you have a simple sample style and see whether this is getting applied (and visible in the console)?
149
Try:
<link type="text/css" rel="stylesheet" href="http://fakedomain.com/smilemachine/html.css" /> If that doesn't work either, then make sure the URL is accessible, and the content is what you are looking for.
22
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
