using / to indicate root directory - html

This is probably a stupid question, but its hard to search for effectively. I am have defined the following:
<img src='/images/image_name.ico' />
This properly creates the path to the root directory then the images directory in all of the browsers I have tested, including IE10, but IE9 will not get the path right. Is there a known problem with using / to indicate the site root with IE 9? I just get a broken image even though the file exists at that path.

No. There are no known issues with IE's ability to resolve root relative URIs.
The usual debug steps you should take are: Check your server logs and browser debug tools to see what is actually being requested, if the request was successful, and if the correct content-type is being specified. Make sure the image file is OK. Check the browser can resolve the URL and open the image directly (without going through a webpage).

Related

Do browsers request favicon.ico even if it is not linked in the HTML

I am looking for a site for somebody, and fixing errors as I find them.
There is no Favicon.. that is ok, I can fix that.
My question is, do browsers (or certain browsers, Chrome in this case) request favicon.ico as soon as they load a site.. or maybe on check that there is no alternative icon path mentioned in the source.. irrespective of whether "favicon.ico" is actually mentioned in the page source?
That was the original behaviour, yes. /favicon.ico was an implicitly present file which (some) browsers would check for. Only later did that actually morph into a proper standard with <meta> tags, arbitrary file names and image formats other than .ico.

HTML file behaves different in dirrerent servers

My first assignment in web programming class is to design a website without browser side and server side script.
I made an HTML 5 document, linked to a CSS file, all of them were validated in W3C validator, everything is good. I test the web page locally on my laptop on Chrome36, Firefox30 and IE11, all good.
But I'm required to upload it to University's server, all good in Chrome and firefox but IE, however I tried to put it on the server on my laptop and access it on IE from University's PC, it behaves all good.
Apache server on my laptop, access from Uni's PC
On Uni's server, access from Uni's PC
My lecturer says I'll lose mark if it behaves so, what could be the problem and how can I solve it? Do server settings affect html's behave? Thanks!
Also, if you want, you can access it via deakin.edu.au/~yshengk/a1
Maybe the html file can't see your css? Check file path's.
The only change I would see is the file and folder path looks different. Check whether you have used correct file/folder path. Try changing the CSS, JS, images folder path between relative folder path or absolute folder path.

Firefox doesn't show images from a local file path

I have used <img> tag in html for displaying images. The image gets displayed in Internet Explorer 10, but it is not visible in mozilla, chrome. Could someone please tell me the reason why?
<img src="file:///d:/maruthi.jpg" style="width: 150px; height: 140px;" alt="Photo">
Chrome stops access to local file:// links from with in http:// page for security reasons by default.
file:// is not allowed in Chrome and Firefox for security reasons by default, but this answer shows you how to change those settings. Really, you should set up a lightweight local server.
The <img> tag is standard across all browsers (except text-based browsers like Lyx). That should work, however given that it is a local path it may be that you are testing it in a different environment that can't access that path?
Review this wikipedia page on the file URI scheme and it will also highlight that some browser will limit access to local files for security reasons.
The original title to OP's question is NOT misleading - it is perfectly valid. However, they did not say whether they were using Windows or Linux. Windows and Windows programs (like DOS from which they originated) are completely indiscriminate with regard to the use of upper or lower case in filenames.
Two possibilities to consider:
Linux is fully case sensitive, including its use of filenames. Yourfile.JPG is NOT recognized as being the same as Yourfile.jpg! I recently migrated from Windows to Linux and encountered exactly the same problem with Firefox. It displayed images in sites on the internet, but not in perfectly valid local HTML and CSS markup. Later, I noticed that the Windows image-editing program I'd been using had saved all the images with uppercase .JPG or .PNG extensions. A few that I'd previously renamed manually had lowercase extensions - these DID display normally! Linux 'properties' for those files identified them correctly as JPEG files, while those with uppercase extensions were simply identified as IMAGE. Also, my markup references all images with lowercase extensions (professional usage). When non-displaying image file extensions were changed to lowercase, they all displayed correctly.
If Steve is still using Windows, it's possible that Internet Explorer is displaying local images for the same reason as above. Firefox, though, uses a different engine (Mozilla) and, being open-source, maybe more strict with regards to case sensitivity in file names. However, I'm not in a position to check this out. Maybe someone else can test.
i have used in jsp as this : and working in firefox and chrome
<a href="Welcome.jsp"><img src="home.jpg">

Font-face don't display well

I have a wordpress site here http://itrain.com.my/v3/ as my Home Page
I am wondering why it is not displaying well in Firefox?
Anyone who is good in css?
By the way, try to look at the subpages http://www.itrain.com.my/v3/index.php/about-us/
it display well.
I am really wondering why does it happening.
Any can help me? Any suggestion, recommendations?
I think problem is with URL.
It work http://www.itrain.com.my/v3/ but doesnt work on http://itrain.com.my/v3/
Set on your server redirection (301) from non-www URL to www URL.
I would wager you have the font installed on your local machine. I don't see it on any browser. Instead, I get two 404 errors.
In other words: please make sure the font files are available at the locations their respective locations: http://www.itrain.com.my/v3/wp-content/themes/itrain/img/fonts/big_noodle_titling-webfont.woff and http://www.itrain.com.my/v3/wp-content/themes/itrain/img/fonts/bebas__-webfont.woff.
[EDIT]
I've just looked at the fonts directory listing on your site. The ttf and eot versionf of your fonts are available, the woff and svg are listed, but result in a 404 error. Furthermore, the ttf version (downloaded instead of woff in Firefox, after getting a 404) seems to generate an empty HTTP response.
So... Make sure the fonts are there, make sure they have proper privileges set (like 0644). I can't see any other issues than the font files themselves as the CSS appears to be correct.
[EDIT 2]
#kubedan provides a great tip that seems to fit your concern about the htaccess: the domain the fonts are downloaded from is always preceded with www. Firefox will refuse to download such content, you need to use the same domain.

Mozilla unable to display images whereas IE does

Could anyone tell me why mozilla firefox unable to display the images where explorer can do? I even changed the extension with CAPs in all ways i can but not yet working. I have written a HTML file and my IE can open in the way i want but when i open my HTML file using the mozilla it is not displaying images but just leaving the image borders.
And also IE can reference to the CSS sheet path and making the changes but wheareas the mozilla its unable to link with css sheet path I have set the text color and font size in my css sheet and linked it with my html file. Its working perfect in IExplorer but not with the mozilla. I have been asking these thing How do i make a standard HTMl file that works on every browser And i got some answers from you but still I am unable to make it work .Can anyone tell me a good document to go through because no matter how i try its working on one browser and throwing the error on some other browser
Im giving it as src="d:\text\image.png"
If you are using absolute paths with drive letters, e.g. <img src="C:\www\images\foo.png" alt="foo">, it will work with Internet Explorer but not with Firefox. If you include drive-letters etc. in the path, the path becomes Windows specific, something that IE can understand but other browsers may not.
To fix the problem, you should use relative paths, e.g. <img src="images\foo.png" alt="foo">. The path should be relative to the HTML file where this code is present.
Most often, web pages are written to be hosted on web servers. Images are usually put under an 'images' directory inside the document root (web-root), say, /images/foo.png. Now, the home page at /index.html can include this image either using a relative path: <img src="images/foo.png" alt="foo"> or an absolute path (path from the document root): <img src="/images/foo.png" alt="foo">. Note the usage of forward-slash as opposed to back-slash. You should use forward-slash. Back-slash is very Windows specific and other browsers may not understand it.
The same applies for CSS or any other paths used in your HTML documents.
For me worked (for Mozilla Firefox v 26.0).
<img src="file///C:/User/MrBrown/www/images/foo.jpg">
Didn't worked:
<img src="C:\User\MrBrown\www\images\foo.jpg">
instead of specifying the path as src="d:\text\image.png"...
change the path as src="file:///D:/text/image.png"
if the folder name are having spaces.. then instead of spaces, write %20. or else open that image file in any of the web browser.. and copy the address from the address bar and paste that address as src path..
it will work for both Google chrome and firefox..