My SVGs are not rendering clearly in Firefox. Other browsers such as Chrome, Opera, and Safari seems to render fine. My Firefox version is 72.0.1
I'm displaying my SVG as:
<img src="assets/name.svg"/>
This is how it looks in the Opera Browser:
And here is how it looks in Firefox:
Based on how you display the svg, you are putting it inside an img tag, which actually works, but the thing here is, the svg edges are not rendered sharp in Firefox.
As a workaround you can link to an SVG file and also retain the ability to affect its parts with CSS by using object tag.
<object type="image/svg+xml" data="wtf.svg" class="svg-logo">
<!-- wtf.svg will render here -->
</object>
This will work fine in Firefox.
*Note: this will also work fine in Chrome, Opera, Safari.
Related
I have two images in my html page that are of webp file type.
<img src="./assets/beros-capak.webp" class="article-image" />
<img src="./assets/mapa.webp" class="article-image" />
But, as you can see in the image above, the first webp image is not loaded and the other is loading fine.
I have tested it on chrome, firefox and safari on iphone, and they are all not loading the first image, while both on android and mac pc load both images with no errors.
Why is that?
It depends on the version of iOS.
All browsers on iOS use WebKit so they are all subject to the same compatibility issues as Safari.
According to https://caniuse.com/webp, WebP is supported on iOS 14 and up.
How can I make paper-button render at its full size all at once in Safari and Firefox? Renders well in Chrome, but in the other two browsers it renders without proper padding and then "clicks" into it's proper display.
Thanks
http://107.170.93.84/
As I was upgrading a site to use bootstrap css I noticed a page that has an iframe that it uses. Another developer claims it works only in IE, but I cannot get it to work in IE, FF or Chrome. FF and Chrome display nothing, while IE 11 blows up trying to load the pdf.
The code that is literally in the view source of what the browsers are trying to read just doesn't look quite right to me. Thoughts?
<iframe id="ContentPlaceHolder1_pdfFrame" width="720" height="590" name="pdfFrame" src="File:\\chc\shared\IntakeTest\Storage\WF_Test_20130702161454_2.pdf"></iframe>
im having trouble with my css displaying correctly in both Chrome and Safari.
Because they are both webkit browsers i cant understand why.
My css positioning and div size displays perfectly in both FireFox and Safari but is all out of wak in chrome.
I have tried css reset but nothing seems to be working. Any ideas?
The website is here
www.girlsskateaustralia.com
I have an issue with my homepage in IE7-8, it seems that the slider wrapper with the background image, for some reason is not being rendered, forcing the inner div to not be centered and look all messed up.
Take a look here, it all works fine in Chrome, Safari, Firefox. But not IE! How do I resolve this issue?
You are using HTML5 tags, those are not supported in older browsers.
Still HTML5/CSS3 is not supported for IE so please tryout with other tag like div or any block tags
Just for your information, the Html5shiv script allows you to use HTML5 tags on older browsers.