XPage not displaying correctly in Firefox - css

I am having trouble displaying XPages in Firefox. Looking at the page, I figured it was a CSS issue so I looked at the source.
I noticed this for the CSS
What is going on here? Other CSS links are similarly corrupted.
The page renders fine in IE 8 but not in FireFox.
Here is a link to the site
https://qacldguide.pnc.com/
You won't be able to login but you should be able to see the issue on the login page.
The server is running 8.5.3.
Update:
Works fine on our Dev server (which is not accessible to the outside world). We are running the same version of server in Dev and QA. Could this be a server setting? My admins are out for the holiday so this one might need to wait but any help here is welcome.
FYI Links still show as
even in Dev.
Update
Works fine in Prod too
https://cldguide.pnc.com/

The one of problems is that the first css is detected as mime.
Try to remove css aggregation.
And if you check the Style Editor tab in Firefox and check the first stylesheet
it has no rules detected and if I add an enter after .lotusVersion{margin:2px 1px 2px 40px !important;}
The site starts to render correct, there is where I should look for the problem.

Turns out, I did not have public access set on my CSS. I am not certian why it worked befoere but that is waht fixed the issue now.

Related

Stylesheet delayed on firefox

My asp.net MVC application use bundling to render stylesheet in my _Layout Page. Once my application deployed, I use Firefox and navigate to my login page and got this weird behavior I can't explain.
When I clear firefox cache to force reload stylesheet from server, I first see my page without any style applied. Then once the stylesheet is loaded, style are applied wich cause some unwanted 'flickering'. On chrome an IE, nothing is displayed before stylesheets are loaded, so no flickering here. I also have a really similar web app on my server for which, when I browse it with firefox, the 'flickering' problem doesn't occur. So I guess it must be something, maybe the order of code blocks in my page, that causes this behavior, not only the browser.
Is there a place where whe can look into your code? It's kinda hard to give an answer by just this question and information. The problem can be caused by alot of possibilities.
Did you try viewing the application on another computer? Sometimes that can be handy to determine if the issue is local (or is a general issue).
If there is a link to share, that would be great.

Inspector won't show css on some websites

I've always used ff inspector to debug css and never had this issue before, I tried to check the css of this website https://www.duolingo.com (the issue occurs only when I'm logged in), but the inspector is not showing anything for any element on the webpage:
The inspector works fine on other websites though, not sure if the website developers intended to hide the css or not, but I found some strange css links seems to be using a proxy:
Is this some kind of new trick to hide CSS or is it a bug in firefox inspector? or is it something else?
I'm using Firefox version 45.0.1
I am pretty certain this is a known bug that has been fixed already.
I don't have an account on this website so I can't be sure, but we've had very similar problems in the recent past.
It could be either:
https://bugzilla.mozilla.org/show_bug.cgi?id=1255787
Which has been fixed in FF48 (it involved an inline stylesheet <style> which defined a sourcemap URL).
Or it could be:
https://bugzilla.mozilla.org/show_bug.cgi?id=1249888
Which has been fixed in FF47 and uplifted to FF46 too (it involved an incorrect CSS sourcemap URL).
You can verify this by tested again with these versions. If it still doesn't work, please feel free to file a new bug here: https://bugzilla.mozilla.org/enter_bug.cgi?product=Firefox&component=Developer%20Tools%3A%20CSS%20Rules%20Inspector with steps to reproduce and possibly, pasting the errors that may be present in the browser console (ctrl+shift+J).
In any case, this isn't a wanted behavior. In the rare cases where there are indeed no css rules to be shown on a given element, then the panel shows a message like "no valid element selected" or "no css rules found", I can't remember exactly which one. If the panel is just empty, then that's most definitely a bug.
I have seen this in Firefox 49 when inspecting my own site on the development server. When I went to the Style Editor tab the list was huge and the spinner keeps spinning.
I went to the dev tools settings and disabled "show original sources". The Style Editor tab now shows two files and I'm able to see the CSS rules (though not my less rules obviously).
I've found this already filed as https://bugzilla.mozilla.org/show_bug.cgi?id=1097834

Site working in FF not in IE, Built with iframes

I have a site, that i built through iframes, but i cant seem to use it with IE.
For safety resons i cannot give access to it, but ill explain wehat the problem is.
First of all i was forced to do it through iframes due to the webserver didnt support .net.
Heres how it looks:
http://ipdg.se/order.htm
So far so good, an iframe working good. But when i try to log in the problem starts.
If FF it goes smoothly, but in ie, it doesnt happen anything(Would normally be redirect to the same page but with session variables and showing other content) i dont know what causes this. but either IE cannot do response.redirects, or there is a problems with the iframe.. or both.
It works in alla major browsers except for internet explorer!
Some time back there was a problem like this... the iframe tag was
<Iframe src="order.php" width="450" height="650"></Iframe>
The solution was to change the src from order.php to order.html... That may not be possible in your case, but it appeared that there was an IE security setting that prohibited the dynamic page from loading.
As a previous poster said. the problem is with IE and its security check, therefore. Using server.transfer got it working.
response.redirect doesnt redirect directly to the page, it communicates with the client browser before the redirect. therefore the browser has a chance to stop the request(Lame IE).
but server.transfer doesnt do that and goes around the problem.

CSS not displayed depending on page

I have a friend that has a really strange issue with my website. When he clicks on http://www.copeo.fr/ the page displays fine but when he clicks on a link like www.copeo.fr/user/ the CSS is not applied even after a refresh. The raw html does display.
I asked him to display the CSS that is hosted on amazon S3 hcopeoressources.s3.amazonaws.com/style/futurvert/style.css and it displays fine.
The code validates on W3C validator so does the CSS. I am lost what could be the origin of the issue. Could it be its enterprise cache? configuration of IE7 on his machine?
If it happens to someone else who could explain the issue to me, I am all hears.
Thanks
Ok got my answer. The firewall blocked the CSS that is stored on amazonaws and for the first page, it was a cache that was filled outside of the company firewall.
Sounds like he is using relative path names. /foo/bar.css will resolve to sitename.com/foo/bar.css but foo/bar.css will resolve to sitename.com/currentpath/foo/bar.css.
There is an IE bug that if you have more than 30 style sheets, some or all of them won't show:
http://support.microsoft.com/kb/262161
It could possibly have something to do with that.
When I hit the CSS URL I got:
"This XML file does not appear to have any style information associated with it. The document tree is shown below"
We use S3 at work for this type of thing and don't have issues, but I think pulling the CSS file off amazon S3 and storing it on a more traditional server might help with your trouble shooting. Or even solve the issue.

Does this seem like an IE8 float bug to you?

I've noticed a strange behavior in two different sites when using IE8.
The first site is in the site that I maintain xebra.com.
The second site is google analytics.
The behavior is that when an address is typed directly into the address bar of IE8, both sites display correctly,
But when one of the sites has already been loaded, and you press the refresh button or F5 key, the layout gets all screwed up:
See screenshots here: here
Something is causing IE8 to render in 'quirks mode' which causes the breakage.
You can duplicate this by browsing to your site in IE8 and selecting Tools > Developer Tools > Document Mode > Quirks Mode.
Make sure your document is always being served in standards mode.
EDIT My original answer had 'compatability mode' where it should have read 'quirks mode' - the two are different.
JS.Companion was what was causing this odd bug, and not IE8. Phew!
http://www.my-debugbar.com/wiki/CompanionJS/HomePage
I spent the whole morning trying to figure out what was going on, I removed companion.js and bingo my site is perfect! thanks for this.
That's really strange. I don't have the problem on my computer with Companion.JS installed and http://www.xebra.com/ web page (under Vista SP1).
I would be happyto correct the Companion.JS bug that generates this problem if you can provide more information about the problem.

Resources