svg logos not working properly in bootstrap in firefox and edge - javascript

I have made this little website for myself: http://jonathanpabst.dk/website/HTML/index.html and it works fine on google chrome.
But when i enter the site on microsoft edge or firefox my svg logos under the section "mine Kompetencer" is not in a row like it would be in chrome and they become big and ruin the page.
i have been unsuccessful in figuring out what is wrong myself, and hope someone in here might have the answer.

Just give them a max-width of 95px and it will work.

Related

Page scroll menu not working Firefox and Chrome

I have created my first microsite with Umbraco/ASP.NET at www.surreyhillsmt.co.uk. I started with a bootstrap theme called Agency from startbootstrap.com, and find that the smooth page scrolling from my menu works on the Edge browser and both Safari and Firefox on an iPhone/iPad.
However, smooth page scrolling does not work on either Firefox or Chrome on a PC (fully updated Windows 10, and both Firefox and Chrome installed within last couple of days). This problem is not exhibited by the static bootstrap theme that I used.
I would really appreciate any help. By way of background I am competent with C# and okay with HTML/CSS. I have zero knowledge of javascript and the like.
This is no longer a problem. Oddly this was fixed with the passage of time. I guess it was a caching related issue.

Website loading times out, images are missing, load half-way, and sometimes appear in wrong places

I've ran into this very peculiar issue where the wordpress website I am working on (Click to see) , looks and works great on all browsers except Safari on iPhone.
The site seems to be loading and times out half way. Sometimes images appear in wrong places, sometimes they're cut off mid-image. We've tested the site on OSX, Windows, in Chrome, Safari, Firefox, and iOS Chrome and it appears to be working great. The interesting thing is that this problem seems to be exclusive to Mobile Safari, consistently across multiple devices from different networks.
Here's are a few examples of what we're seeing:
In this photo should be a background image and a menu icon in the nav.
And in this photo what is that image doing in there? There should be another logo and these should be scrolling right to left instead of being displayed vertically.
And in this one Some images don't load at all and some don't load all the way.
And also in this one same portion of the website as above, except nice and crisp, how it should look. This was using iOS Chrome.
We tried isolating the issue by switching over to the default Twenty Fifteen wordpress theme, where we created an image heavy blog post (without any widgets), and the issue persisted.
We've been clearing browser caches and using W3 Total Cache to clear WP cache, but no luck.
Also had the website host, Namecheap, reset the server configs, just in case that would solve the issue, but, alas, no luck either.
Has anyone run into this bizarre issue in the past? Any ideas what else we could try?
Thank you so much in advance!

Image not appearing in mobile view

I've been developing a mobile-first site, using Firefox as the primary browser. I have a branding logo at the top of the page, loaded by way of the WordPress customizer. The logo appears fine in Firefox, but disappears in Chrome and Safari when at a width of 320px. (That's the base width for this project.)
I'm just troubleshooting and trying to find the best way to fix the problem. I'm not really sure what's causing the issue, yet, though. I was hoping to get some other perspectives on this.
Here's the link:
--- link removed ---
Thanks!
I would like to suggest you something that had helped me a lot of times when I did not know from where comes a problem:
Reduce the content only to the part you want to fix(or in case if you have a bug and do not know from where comes - start removing code element by element).
BTW in the developer tools is showing a lot of errors.
Thanks, Marin. I appreciate your suggestions. I think my server at work may be contributing to the issue. For the time being, though, switching the width and height from % to em has at least resulted in the images being visible in chrome and safari. I think I'll have to wait until I can test it outside my workplace to be sure, though. Lol. Thanks, again.

Google Chrome background jittering when moving pictures

I was working on an image gallery and it involved some heavy image moving\resizing using javascript. Everything worked like a charm on all the broswers except for IE6\7 (no wonder) and ... Google Chrome.
Basically under certain zooming each movement made Chrome redraw the background, making it jitter, change its position and then move back. I can't post link to the actual script at the moment, but I used a jquery plugin to immitate the problem:
http://danilsk.narod.ru/wtf.html (try zooming in and out and clicking images)
Does anyone know how to fight this?
I am using google chrome and I see no issue here.
Everything is running very smoothly. Try updating your browser.
FYI:
Ubuntu 10.04 LTS - the Lucid Lynx
Google Chrome 8.0.552.215

Internet Explorer 7 Google Map Rendering Problem

Hi I'm having some trouble with IE7 when doing a map.
I've made an xml and ajaxed it to grab points based on where the user is on the map.
It works well, and in FF, IE8 no problems when they click the points. On IE7 it firstly misses the cross at the top right, has some problems with the border (fixed that with some margin) and more importantly cuts out an portion of the image which I can't figure out.
I've attatched an image and what you see there is basically an a tag with a background image.
I've taken the title out as I thought that might cause it. Basically I'm stumpped any ideas.
Thanks
Richard
There seems to be a bug in Internet Explorer which has to do with how transparent PNGs are scaled when using the Zooming feature of the browser. It's difficult to reproduce because it's a local browser setting.
It happens even in maps.google.com. See the example below at 125% zoom, using Internet Explorer 8:
Is your zoom set to anything other than 100%?

Categories

Resources