I have a page which I load both on a local Tomcat 7 instance and a remote JBoss instance (OpenShift). The css is applied on JBoss, but not on Tomcat 7:
Html page head:
<head>
<title><decorator:title /></title>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
<link rel="shortcut icon" href="/images/favicon.ico" type="image/x-icon"/>
<link rel="stylesheet" type="text/css" href="/static/css/reset.css" media="screen" />
<link rel="stylesheet" type="text/css" href="/static/css/960gs-16col.css" media="screen" />
<link rel="stylesheet" type="text/css" href="/static/css/default.css" media="screen" />
</head>
Default.css
body {
background-color: #c73b0b;
}
rest.css and default.css are not applied on Tomcat 7. I checked with FireBug, no bugs reported. I checked the page source code on both systems, exactly the same.
What could cause this issue?
As we resolved together with #JVerstry:
Seems that Tomcat wasn't loading the CSS files the same way as JBoss.
/static/css/reset.css is an absolute path. If reset.css is part of the application, it should be referenced as static/css/reset.css (without the leading slash)
You should always build URLs in a webapp like this:
<link rel="shortcut icon" href="<%= request.encodeURL(request.getContextPath() + "/images/favicon.ico") %>" type="image/x-icon"/>
This will make your webapp trivially re-locatable when you change the context path, and solve problems like the one you have posed above.
Note that most URL-handling tag libraries like JSTL, Struts, etc. will all perform the above work for you. It's usually better to use one of those than have that ugly scriptlet everywhere in your JSP code.
Related
I am reading css file from aspx
Login.aspx
<HTML>
<HEAD>
<title>LoginWebForm</title>
<meta name="vs_showGrid" content="True">
<link href="stylesheets/layout.css" rel="Stylesheet" type="text/css">
<link href="stylesheets/LoginWebFrom.css" rel="Stylesheet" type="text/css" />
</HTML>
</HEAD>
and directory structure is,
MyProject
- folder1
- folder2
- stylesheets
- layout.css
- LoginWebForm.css
- Login.aspx
So, here Login.aspx and folder stylepsheets are on same level, it means i can by specifying path as, "stylesheets/layout.css"
but. this does't work. If I run same application on **Windows 2012 server then it works**. but when I run it on Windows 7 then it it doesn't work.
Can you please let me know whether this is OS related problem OR some settings required/ configuration required to be run the application on Windows 7.
Thanks You
Your html structure is not good:
<HTML>
<HEAD>
<title>LoginWebForm</title>
<meta name="vs_showGrid" content="True">
<link href="stylesheets/layout.css" rel="Stylesheet" type="text/css">
<link href="stylesheets/LoginWebFrom.css" rel="Stylesheet" type="text/css" />
</HTML>
</HEAD>
This would be a "normal" html structure:
<HTML>
<HEAD>
(head content)
</HEAD>
<BODY>
(body content)
</BODY>
</HTML>
Try to fix the html structure and maybe works after that ;-)
Another thing you could try is start your CSS paths with "/", for example:
<link href="/stylesheets/LoginWebFrom.css" rel="Stylesheet" type="text/css" />
And... Why one of your "link href..." lines ends with "/>" and the other one ends with ">" ??
I think both are correct ways (not sure now), but... Why you do it in a different way in any case??
good luck
I'm working on a portfolio and it looks great in localhost, but when I try to commit it to Github (https://gabrielbrickle.github.io/) the CSS does't work.
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
<link href="font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css" />
<link href="css/nivo-lightbox.css" rel="stylesheet" />
<link href="css/nivo-lightbox-theme/default/default.css" rel="stylesheet" type="text/css" />
<link href="css/animations.css" rel="stylesheet" />
<link href="css/style.css" rel="stylesheet">
<link href="color/default.css" rel="stylesheet">
<link href="css/custom.css" rel="stylesheet">
try changing this:
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
to this:
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
If you open the developer console(right click inspect element), It says youre trying to load from http in a https
Use https:// for bootstrap css Link.If you right click , Inspect and look at the Console in Chrome you'd find the errors.
Github is loaded over HTTPS. Referencing external stylesheets will require the same protocol.
You can see the errors in DevTools.
You can either save Bootstrap locally and reference it, or load it with HyperText Transfer Protocol Secure (HTTPS).
I had a similar issue. I messed around and figured out that I had referred to one of the sources incorrectly. I used the wrong case for the first letter of a folder of a source. I had used ./Assets/css (incorrect one) instead of ./assets/css (correct one). Fixing the error fixed the CSS on the Github site as well!
I've got the following folder hierarchy in my web application.
I'm using the following relative path to access my CSS files but the layout doesn't detect the CSS. There are two layouts but I'm calling the CSS from the layout file which resides inside the views folder.
This is the path I used to access the CSS file.
<link rel="stylesheet" type="text/css" href="../style/style.css">
I used this path too but no luck.
<link rel="stylesheet" type="text/css" href="../../style/style.css">
Please help!
Check whether you are not using multiple CSS files. And if you are using Chrome/FF you can check whether your CSS is called or not with tools like firebug.
You can see the full path with these tools.
if your layout file loading in another file try that files path or simply use path like this
<head>
<link href="/style/style.css" rel="stylesheet" type="text/css" />
</head>
your real layout can be work like this too
<head>
<link href="style/style.css" rel="stylesheet" type="text/css" />
</head>
You can use this:
<link type="text/css" href="style/style.css" rel="stylesheet" />
The second Path should be correct.
I also tried it in Visual Studio 2010 with the same folders as you and VS gives me the same Path (Second one) as you said.
Another Question, do you put the link into the header of the HTML page ?
<head>
<link href="../../style/style.css" rel="stylesheet" type="text/css" />
</head>
<body>
</body>
On my web page I have the following line in the <head> element:
<link type="text/css" href="C:/myApps/app1/images/css/12.02/main.css" rel="stylesheet" />
When I go to view that page in Firefox 11.0, it is obvious that the main.css is not being loaded. If I go to view page source, I see the <link> element (above) in the HTML, but when I click it I get the following error:
Firefox doesn't know how to open this address, because the protocol (c) isn't associated with any program.
How do I fix this?
try:
<link type="text/css" href="file:///C:/myApps/app1/images/css/12.02/main.css" rel="stylesheet" />
might work
Edit: as per the other answers, this is when you want to use a css file on your local machine, if the website will be hosted then you'll need to use a relative path.
<link type="text/css" href="images/css/12.02/main.css" rel="stylesheet" />
The above assumes that your html file with the link in is located in your "app1" folder.
Martyn
you need to insert an url/uri => file:///C:/myApps/app1/images/css/12.02/main.css
Hi you cas change your css path
<link type="text/css" href="C:/myApps/app1/images/css/12.02/main.css" rel="stylesheet" />
into
xxx.css replace into correct path
<link type="text/css" href="xxx.css" rel="stylesheet" />
I have a problem with a web page. The introduction of a simple <base href=""> tag in the head of the page creates lots of unexpected problems such as dismantlement of the layout of the page, size of figures etc. Here is the web page without http://vlab.mooo.info/tanks and this is with the tag: http://vlab.mooo.info/tanks/wrong.php.
Note: I've tested with Firefox and Chrome.
You have file
http://vlab.mooo.info/tanks/style-tanks.css
which is called in
http://vlab.mooo.info/tanks/
via
<link href="style-tanks.css" />
With base href set to the root, the browser looks for http://vlab.mooo.info/style-tanks.css which is wrong
Change to
<link href="/tanks/style-tanks.css" />
The problem is line #14:
You have
<link rel="stylesheet" type="text/css" href="./style-tanks.css" >
Should be:
<link rel="stylesheet" type="text/css" href="./tanks/style-tanks.css" >