Why is this interpreted as absolute url? - html

I want to hide my gitweb instance behind a reverse proxy. So I set my base url to /gitweb but some URLs are still broken.
As I debugged the problem I found that the following stylesheet is loaded from /gitweb.css instead of /gitweb/gitweb.css.
<base href="/gitweb" />
<link rel="stylesheet" type="text/css" href="gitweb.css"/>
I've found a fix for this problem which says these links are interpreted as absolute urls. Unfortunately I'm not using Apache - which was used in the fix.
Anyway. I'm just wondering why href="gitweb.css" is not using the base href

He does, but the missing slash makes that the browser thinks "gitweb" is a page and only use the "/". Which is the same as base.
See: https://stackoverflow.com/a/1889957/4516689
Or the example in the spec: http://www.w3.org/TR/html5/document-metadata#the-base-element
<!DOCTYPE html>
<html>
<head>
<title>This is an example for the <base> element</title>
<base href="http://www.example.com/news/index.html">
</head>
<body>
<p>Visit the archives.</p>
</body>
</html>
The link in the above example would be a link to
"http://www.example.com/news/archives.html".

Related

Linking CSS doesn't work

So my CSS doesn't work for some reason. I have searched online and cannot find a problem with it but the CSS is not connecting to the HTML. Here is my code:
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="yee.css">.
</head>
<body>
<audio id="yee" src="C:\Users\Jake Coffey\Downloads\yee.wav" preload="auto"></audio>
<center><img src="https://vignette1.wikia.nocookie.net/smashbroslawlorigins/images/1/16/Yee.png/revision/latest/scale-to-width-down/280?cb=20140904202925" onclick="document.getElementById('yee').play();" /></center>
</body>
</html>
This maybe... never mind...
But I got this problem.
Try add / to your link tag end
<link rel="stylesheet" type="text/css" href="yee.css"/>
It's hard to answer because we can't see your file structure.
This href you are using href="css/yee.css" is assuming that your files look like this.
/ project-folder
index.html
/ css
yee.css
The href tells your HTML file where to look for the CSS file. If your CSS file is in the same folder as your HTML file try changing the href to href="yee.css"
Hope that helps!
EDIT:
https://codepen.io/718studio/project/editor/ABPvrZ/
Make sure that you type the href correctly :
href="yourfolder/yourcssstylename.css"
Try to make the link the same level as index.html directed to the css folder.
<link rel="stylesheet" href="yourfolder/css/styles.css">
or only ...href="css/styles.css"> and make sure delete / before css file name.
its always better to specify full address for css file like
href="http://localhost/public/css/yee.css"
and make sure you use correct protocol http:// or https for your server.
ps you can save your site directory as a constant, in order to not check links during deployment

html <base> tag functionality misunderstood?

I have simple IIS Structure:
DefaultWebSite
testapp
DefaultWebsite - landing page reachable by going to 192.168.1.5
testapp - web application reachable by going to 192.168.1.5/testapp
testapp's index.html
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Test App</title>
<base href="/testapp/" >
</head>
<body>
Test Link
</body>
</html>
I'm using base tag to set base of the app, so when clicking on Test Link I would expect just to reload the page as it is pointing to documents root.
But this is not the case. Clicking on the "Test Link" takes me to the index of DefaultWebSite.
Is this the way how this should work or am I not understanding the the base tag correctly ...
The base tag only applies for all relative URLs. So, with the base tag like <base href="/testapp/"> the following would apply.
link
would refer to the DefaultWebsite.
But
link
Would refer to your testapp.
base only comes into play on relative hrefs. So
Test
is not affected by base at all.
BalusC has a very informative answer on its uses at https://stackoverflow.com/a/1889957/451600

base element is not working in my local machine

I'm trying this base element in my local machine, but it's not working.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>this is an html base element exampe</title>
<base href="/home/sugumar/Desktop/html/base.html"/>
</head>
<body>
<p>Is it working</p>
click here
<img src="/images/html5.png">
</body>
</html>
link is not working.
Image is not showing.
I'm using Debian, and Mozilla Firefox.
The URL /home/sugumar/Desktop/html/base.html is relative to the server root, since it begins with the slash character /. When you view a document locally, there is no server, hence no server root, and the effect of setting base URL is thus undefined.
The solution is that you don’t use the base element and set addresses relatively to the current document, e.g. ../images/ptsb.html.

html <base> tag referring to local folder

I'm trying to set a local site-root using the base tag. The following code isn't working. Am I doing something wrong? How do I set the mysite folder as base?
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<base href="file:///home/me/mysite"></base>
<title> Asset Take On Process </title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
<link rel="stylesheet" type="text/css" href="/css/main.css" />
</head>
<body>
some stuff
</body>
</html>
The site folder structure is
mysite
|___css
|___img
|___js
and so on..
When I load the web-page it doesn't see the main.css in the css folder at all.
If you remove that /, it should make it relative off the current path, which, when a base tag is present would be
http://localhost/website/.
You will also need to add a trailing / to the end of the href, to indicate that it's a folder.
Full working example:
<!doctype html>
<html>
<head>
<base href="/test/" />
<script src="assets/test.js"></script>
<body>
hi
</body>
</html>
Actually depending on who you ask, it's still relative since it is relative off the current domain. But I prefer to call this absolute since it's signifying the path is from the root, based on the current domain. Although, I guess technically that makes it relative in the grand scheme of things, and absolute only in terms of the current domain. Whatever.
kindly refer this link
http://social.msdn.microsoft.com/Forums/ie/en-US/c51bb8b9-40ab-437b-a125-88b660f3e1ca/ie8-base-tag-issues
A correct tag would be
<base href="file:///home/me/mysite/"/>
if you wish to set file:///home/me/mysite/ as the base address, so that e.g. css/main.css refers to file:///home/me/mysite/css/main.css. Note the importance of the slashes. In an href value in base, anything after the last slash is ignored: file:///home/me/mysite means the same as file:///home/me/ there.
This is a confusing topic, and it is further confused by some browsers’ implementation that may support relative URLs in the value; by the specifications, only absolute URLs are permitted.
There is normally no reason to use the base element. Relative URLs such as css/main.css or ../css/main.css work just fine, specifying addresses as relative to the address of the HTML page. This means that they need not be changed if the site is uploaded onto a server.
Just to clarify the other answers:
The base tag must end in a slash.
The following URL's must not begin with slashes:
It's logical, because adding them together makes a complete address. But it's counterintuitive because we're used to using /images/image.jpg to make things work everywhere.

Why base tag does not work for relative paths?

I have a <base> tag as below in <head> section of the page:
<base href="http://localhost/framework">
And a script as below which is relative (of course after <base>):
<script src="/assets/jquery-1.7.1.min.js">
But when I open jQuery from firebug it shows:
<!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML 2.0//EN">
<html><head>
<title>404 Not Found</title>
</head><body>
Blah Blah Blah....
When I use the below link it's OK though:
<script src="http://localhost/framework/assets/jquery-1.7.1.min.js">
I looked for an answer everywhere, but it seems I'm doing my job right! So what is the problem?
/assets/jquery-1.7.1.min.js is not relative but absolute*, the / takes it to the root even with a base tag.
If you remove that /, it should make it relative off the current path, which, when a base tag is present would be http://localhost/framework/.
Note: You will also need to add a trailing / to the end of the href, to indicate that it's a folder.
Full working example:
<!doctype html>
<html>
<head>
<base href="/test/" />
<script src="assets/test.js"></script>
<body>
hi
</body>
</html>
* Actually depending on who you ask, it's still relative since it is relative off the current domain. But I prefer to call this absolute since it's signifying the path is from the root, based on the current domain. Although, I guess technically that makes it relative in the grand scheme of things, and absolute only in terms of the current domain. Whatever.
Try having your base tag like:
<base href="http://localhost/framework/">
and your script tag like:
<script src="assets/jquery-1.7.1.min.js">