link rel not working without http:// protocol - html

i'm trying to implement various semantic links on the website I'm working on.
For that, i try to put
<link rel="start" href="index.html" />
In my head section.
Although the data is present in the web page, Opera does not seems to see it to show the navigation bar that should however be present.
Here is my full head section.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html"/>
<title>Amnistie et compagnie</title>
<link rel="start" href="index.html" />
<link rel="previous" title="aaaa" href="365-gestes-pour-sauver-la-planxc3xa8te-2.html" />
<link rel="next" title="aaa" href="5-best-data-visualization-proj.html" />
</head>
Furthermore, when replacing urls with absolute ones, it seems to work correctly. is there something I did wrong ?
I even tried using code samples like this one, but my navigation bar (which is set to show automatically) never appears, except when a href is an absolute url, what I radically don't want.
So, how can i specify link elements with relative urls ?

what happens if you try the following doctype?
<!DOCTYPE html>

Related

'a href' link associated with local HTML file not responding while others work fine

I have a HTML document where one of the links is simply not working. All of the HTML files are accessed locally by this and other links, older ones (with exactly the same syntax) are working fine, but this one seems to not be linking to anything.
problematic link
<p id="nextbutton">NEXT</p>
CSS (just in case)
#nextbutton {
width:90px;
height:30px;
color:#333;
font-size:20px;
background-color:#54B6FE;
border:thin solid #666;
text-align:center;
float:right;
}
code on linked page
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Sign Up</title>
<link href="stylesheet.css" rel="stylesheet" type="text/css" />
</head>
<body style="height:2100px;">
hello world
</body>
</html>
Probably easier to outline what I've tried but has failed to correct this:
copying and pasting working links inside the div area (they worked fine)
changing the name of the HTML file
trying multiple versions of HTML file as the links location.
removing any ID links and simply having a "<p>...</p>" link with no styling.
isolating the folder to a different part of my PC (the files are part of a WINFORMS application that uses a browser tool. This should not be an issue as when I isolate the root folder away from the compiler, the problem still persists)
moving the link to other areas of the HTML document.
testing different iterations of the target page.
I know the problem is not the linked page itself as it works fine in a browser. The links syntax is exactly the same as other links I have used on the page and the filename is identical with no special characters or anything that would give a browser some problems... WHY!!!!
let me know if any more information is needed.

HTML not showing style on (local) browser

I have made an HTML file (code will be shown below for reference) using some images and style sheet (from local filesystem).
My Folders are as follows:
Main (contains the StyleSheet Style1.cs and HTML file Page1.html)
Images are placed in folder Main/pics
The style is perfectly visible in Code Editor (VS 2010), but whenever I run the file on Mozilla or Edge, etc, its failing to show any image or even style. Here is screenshot of html in editor:
Yes I have seen the question here but my problem is not fixing even though I tried it on both IE and Mozilla (Edge as well). (And I have followed the preventive measures as prescribed by the question above)
My code is pretty simple:
<!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>Untitled Page</title>
<link rel="stylesheet" type="text/css" href="/Style1.css" />
</head>
<body>
<div id="HeaderDiv" class="top-header-blue">
Header
</div>
<div id="CentreDiv" class="content-header-white">
Test
</div>
<div id="footerDiv" class="footer-centre">
CopyRights 2015 -
</div>
</body>
</html>
Any help will be so valuable. Thanks
you have given the wrong path in style as / in before the Style1.css just replace
<link rel="stylesheet" type="text/css" href="Style1.css" />

Favicon not working on webpage in IE10 and below

Why is the favicon on this webpage not working in IE10 and lower? The webpage is here. It works in IE11 as well as other major browsers.
Here is the code on the top of the page:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html dir="ltr" xmlns="http://www.w3.org/1999/xhtml" lang="en">
<head>
<title>...</title>
<meta http-equiv="X-UA-Compatible" content="IE=8,IE=9" >
<!-- (various stylesheet, script, and meta declarations) -->
<link rel="Shortcut Icon" href="/riteAid-theme/images/custom/riteaid.ico" />
<!-- (more stylesheets and scripts) -->
<link rel="canonical" href="..." />
</head>
Things I have tried (to no avail):
Setting type="image/x-icon" in the link declaration.
Setting rel="icon" in the link declaration.
Setting the declaration higher up in the head.
Changing the name of the icon to favicon.ico
I am using a new virtual machine instance between attempts, so caching is not the issue.
It looks like the .ico file is in the wrong format (PNG or GIF). See this question.

Getting W3C "document type does not allow element "LINK" here" even though links are in head?

I am running my site through the W3C validator and getting the error:
document type does not allow element "LINK" here"
for my external CSS style sheet links.
However, my links are within my head tags:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Title</title>
<meta name="description" content="[[*description]]" />
<link rel="stylesheet" type="text/css" href="css/style.css" />
</head>
Would anyone know why this is occurring?
I am using the ModX Revo CMS if that matters.
The link isn't in the head.
You are using HTML 4 so / will end a tag. This means that <meta /> is the same as <meta>> which is the same as <meta>>.
You can't have character data in the <head> but the end tag for <head> and the start tag for <body> are optional. Therefore, <meta /> is the same as:
<meta>
</head>
<body>
>
Since the link element appears after this, it is in the body.
Get rid of the /. You aren't writing XHTML.

Multiple Html <head> in the browser , caused by DreamWeaver bom

I am using DreamWeaver to code xHtml docs. in the program the code is valid but when I upload it in the inspect element I see double <head> tags and when I right-click to see the source file it seems o.k.
Is it because I'm using dreamweaver? what can be wrong?
the first error is : "Extra <html> encountered. Migrating attributes back to the original <html> element and ignoring the tag." - in line 3
The code:
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="keywords" content="the content of my doc" />
<meta name="description" content="this is an example document" />
<link rel="alternate" type="application/rss+xml" title="rss feeds" href="linkto/xml/feeds.xml" />
<!-- scripts -->
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<title>The Title</title>
</head>
<body>
<!-- content -->
</body>
</html>
Thank you very much.
No problem in Chromium 5.0.307.9 (Developer Build 39052) under Linux. I can't test it in Safari now.
EDIT: Proposed test case had nothing to do with this problem, neither could see any extra <head> tags. However, I looked at the Developer Tools of Safari and Chrome under Windows and Firebug in Firefox and all three rendered the DOM incorrectly. Just have a look at this picture and see that the first <link> tag has jumped into the body.
This problem also has nothing to do with Javascript because when turning off Javascript the result is the same, even more clear when comparing with the source code. Strange I didn't notice this under Linux.
The Developer Tools of the WebKit browsers give an even clearer picture (also notice the jQuery error message). I suspect the Unicode Byte-Order Mark (BOM) at the beginning of the file causing the problem: as you can see the BOM is moved to the <body> of the document, perhaps dragging several elements in the <head> with it. But also the unclosed <link> elements, as shown by the W3C validator, might give some issues, although browsers usually handle this without any problems. First get rid of the BOM in your file and see if the problem persists.
And I see another error: those tags beginning with <meta ... are called meta tags, not "meat tags". ;-)
You should have a title element what you write between
the <title></title> tags will been displayed in top bar of your browser
Just make sure your
</head>
tag has the slash in the actual file you're working on. That's an easy typo.
To remove BOM from your document, you can use this php function:
function removeBOM($str=""){
if(substr($str, 0,3) == pack("CCC",0xef,0xbb,0xbf)) {
$str=substr($str, 3);
}
return $str;}