Jump to content


What is the most compatible vector image type for browsers?

  • Please log in to reply
3 replies to this topic

#1 phpjayx

  • Members
  • PipPipPip
  • Advanced Member
  • 60 posts

Posted 14 January 2013 - 06:38 AM

I've read some things that SVG files are fairly compatible with browsers. I attempted to implement them in the CSS code like below, of course swapping the .pdf to .svg, but at least in Firefox or my IPAD, nothing showed up. Would I need to implement it in another way? Some extra plugin needed?

How about other vector image options, what is the most compatible type? The .PDF option seems to work great on my Apple products, but no where else....

Or any combination of plugins or other tools that would help one of these other file types be successfull?

.myButton1 {
background:url(/Button1.pdf) no-repeat;
width: 50px;
height: 50px;
border: none;


#2 phpjayx

  • Members
  • PipPipPip
  • Advanced Member
  • 60 posts

Posted 17 January 2013 - 04:45 AM

Well no answers....

but since I was only able to get .PDF images to work in Safari, I ended up just doing a browswer check... And load up the quality .PDF images when using Safari. If I discover more image types that work with other browsers I'll add those as I find them.

I can't beleive more browsers don't support some standard Vector image like .PDF

Edited by phpjayx, 17 January 2013 - 04:47 AM.

#3 Christian F.

Christian F.
  • Staff Alumni
  • Advanced Member
  • 3,106 posts
  • LocationNorway

Posted 17 January 2013 - 07:18 AM

PDF is not a vector image, it's a Portable Document Format file. Its abilities to save an SVG is just part of what it does, just like the ability to save images in ODF/DOC files is just a part of what those formats does.
I recommend using the proper SVG format for storing SVG images, and you'll find that a lot more browsers will work as intended then. ;)
Keeping it simple.

#4 cpd

  • Members
  • PipPipPip
  • ¬_¬
  • 892 posts
  • LocationLondon, UK

Posted 17 January 2013 - 10:09 AM

You can also use Javascript libraries to manipulate the images however you like.

"Debugging is twice as hard as writing the code in the first place. Therefore, if you write the code as cleverly as possible, you are, by definition, not smart enough to debug it."

"One of my most productive days was throwing away 1000 lines of code."

0 user(s) are reading this topic

0 members, 0 guests, 0 anonymous users