AJAX not displaying in chrome, every other browser is fine - html

I'm having a bit of an issue with a site displaying properly in Chrome. AJAX loads but doesn't make the final call to display in Chrome only. I've tested in Safari and Firefox and it works just fine.
I'm a bit new and don't have the tools to detect browser specific errors and was hoping someone on here could. The site is
http://www.veracitycolab.com
As you'll see, the page content loads in FF and Safari, however it doesn't get to its final display point in Chrome. Any help you can provide would be awesome.
Thanks!

set #main css from opacity:0 to opacity:1 and it work fine in Chrome

Related

The website UI does not look fine in safari but looks perfect in chrome and firefox

So there's this problem with the site's UI:
it works fine in Google chrome etc in mobile browsers but when viewing in Apple safari mobile browser, the site's UI gets displaced.
I have tried everything, I guess the margin property is not working in safari. Take a look at Screenshots.
how it looks on android chrome
Second image is how it looks on safari. and it should be like first image on safari as well
First thing I would think of that try to use a css normalizer
https://necolas.github.io/normalize.css/
Along with a css prefixer to ensure the problem is not from the design
https://autoprefixer.github.io/
In case both of these solutions didn't work please provide a JSFiddle Code in order to help you properly.

Leaflet legend colours not showing in Chrome

I am having trouble with Chrome
In Chrome, this example works for me
http://leafletjs.com/examples/choropleth/
When I apply this code to a custom map and open it with google chrome, the first colour gets applied and then all remaining colours are classed as colour #2. The HTML/CSS is correct, but it is not applying. It works fine on Firefox, Safari & Chrome on mobile, and it even works fine on other peoples Chrome, but the legend is not working on my chrome in development environment (running on virtual box) or production.
I have tried deleting cookies, application data and chrome is up to date and same version but the code is not being applied properly.
Anyone have a suggestion?
Thanks!
Yes, this worked for me. Turning hardware accelaration off brings back the colorscale in the legend.

Chrome shows a page with Errors but Firefox and Safari Show well

I am using a Theme: http://bucketadmin.themebucket.net/
This theme have a timeline: http://bucketadmin.themebucket.net/timeline.html
If you open the page with firefox or Safari all work well, but until yesterday chrome shows with errors.
why happened? how i can fix it?
Thanks
Inspecting that page of yours shows that the line is left:50% changing it to left:33% looks about right, and if that messes with your design on other browsers you can use javascript to enable this change only for chrome.

HTML form only works in Chrome after browser refresh

I'm working on an existing Rails application using Turbolinks.
I have a plans page with upgrade/downgrade functionality. When this page is visited from another page and a button is clicked to upgrade nothing happens, although when I refresh my browser it seems to work fine and posts the form.
The strange thing is that other buttons work fine with Turbolinks installed and it only seems to happen in Chrome. Firefox, Opera and Safari it works fine.
Has anyone encountered this problem before? I've searched through Google all morning but can't seem to find a resolution.
It seems like it's a problem with Google Chrome. I've fixed it by putting the attribute data-no-turbolink in the HTML on the link that goes to the page in question.
Now, when I go to the page via clicking on the link it doesn't use Turbolinks and makes a full refresh of the page.
To just target Chrome (as it seems to work in other browsers) you could use this piece of js:
if ($.browser.webkit) {
$("your-css-selector").attr('data-no-turbolink', true);
}
Could be seen as a bit of a hack, but it works.

Weird bugs while working in Chrome

I'm working on a specific page:
http://portfolio.jrstrauss.net/work/cg.html
and Chrome is doing a bizarre job of rendering the page. It renders perfectly in all the other browsers, Opera, Safari, Firefox, Camino, but Chrome does not give the same results.
I change nothing in the markup and refreshed, but now the layout is all jacked up. I was working with Chromium yesterday and started having the problem, but it was acting bizarre-- I would load the page and it would render fine every single time, but when I would refresh, it would completely change. Then tried it in Chrome and had no issues, so I passed it off as a Chromium bug. Now tonight it started doing the same thing in Chrome, even though it didn't before, so now I'm starting to wonder if there a problem with my markup. Though I see nothing. Does anyone else see a problem with my CSS or HTML?
If it looks good in Chrome on your computer, let me know via comment. I've taken a screen shot to show what it's supposed to look like and what it's doing weird in Chrome/ium.
Renders correctly:
http://i.imgur.com/qp8mu.jpg
Renders incorrectly (only in Chrome and Chromium):
http://i.imgur.com/iIhdI.jpg
It renders correctly in chrome for me, but it seems highly likely to be a problem with wrapping. If I reduce the width of your div.innerContentBox from 800px to 600px, then it looks exactly like the problem you've shown. As I said, I can't reproduce the problem, but it seems to have something to do with insufficient width.