IE11 SVG background images not displaying correctly

IE11 SVG background images not displaying correctly

The Problem

There is an issue with IE11 when rendering some types of SVG files the styles are embedded as a <style></style> element inside the SVG file.

Because IE11 uses a different rendering engine for CSS images and HTML images the images differ from when including the SVG file inside compared to when using the <img> tag.


<img src="/images/badge.svg" width="32" height="32"/>


 .badge{ background-image: url('/images/badge.svg'); }


The Solution

In total there are four ways of exporting an SVG from Illustrator or other tools:

  1. Presentation Attributes

  2. Style Attributes

  3. Style Attributes (Entity Reference)

  4. Style Elements (this does not work in IE)

In order to export the SVG file correctly follow these steps (Adobe Illustrator CC 2017).

1.Open the SVG file if it’s not already open. Go to File > Export > Export As

2. Select SVG as Format from the dropdown and click on the Export button.

3. On the next screen make sure that the selection for Styling is Inline Style. Click the OK button.

That’s it. Now the SVG element will display correctly.

Github : bash script

Github : bash script

Recently I have been tagging my releases with the following tag format "release/0.2.10" and I felt the need to generate a changelog that would then be visible on github and in case I needed to recount the changes that were done per release.ermissions

First thing I did was to check if there was something out there already and I found some packages but they did not suite my needs. So I found this small script on stackoverflow by Andrey Nikishaev to loop through tags in a github repository and ouput the result in the terminal.

I had to modify the code a bit to include the commit date of the release and because I am using a different tag format for releases, rather than just a version number. Although the code is not perfect you can filter by author in the git log line e.g. 'SImon Facciol\|John Doe\|mary.doe'.

To generate the file, create a file with that name and extension in the local repository root and copy the bash script in the same folder. Then open a terminal or console window, navigate to the repository root and run chmod +x so the script has execute permissions. Then run ./ > and if all goes well you should be able to see the tags and commit messages inside file.

To update the changelog simply run the script, and it will overwrite the existing

Python: Rename files using a csv map

Python: Rename files using a csv map

This script is written in Python and makes use of a 2 column .csv file to find and rename files by mapping their existing name and rename it to the new one.

Python: Check the resolution of images in a directory

Python: Check the resolution of images in a directory

Check the resolution of images in a directory and output the filename of the incorrect images.

I had to check over 200 images and there was no better way than using Ruby or Python on OSX to go through all those image files and check their proper dimensions, and I chose Python for the job. In this particular scenario, I am loading all the files ending with extension .jpg and check if the dimensions of the image are 410 wide and 300 height. If the dimensions of the image are wrong I am outputting the filename of the image file, so I know which ones are wrong to fix them.

In order to run the script save it to a .py file in the directory where you want to check the image files, open the terminal and navigate to the location of the .py file and then run python

MySQL Trigger to generate a slug on before insert a new row

MySQL Trigger to generate a slug on before insert a new row

This week I needed to write a trigger for MySQL to generate automatically the slug from a string column whenever a new game is added. What this trigger does is to get the game name column and replace some characters to generate a proper slug. Watch out for the escaped characters that are removed after the trigger is created.

Jaybird X2 FIRE

Jaybird X2 FIRE

I just got my Jaybird X2 FIRE (red colour) today after deliberating through a dozen reviews and various other wireless in-ear headphones. I went for the Jaybird X2 mainly because of the battery life which is stated to be around 8 (eight) hours thanks to the 100 mAh Lithium Polymer. The design is also minimal, lightweight and sleek; I like the matte finish (one reason I did not go for the older Bluebuds X model). In addition I read a lot of the good reviews even on the previous older model the Jaybird Bluebuds X, and besides some issues because of the sweat when you put the headphones in over-ear I believe they are the best there is on the market right now. I bought mine from Amazon as it shipped to Malta and I have had a good experience with Amazon so far.


Getting Started

It took me some time to adjust the earphones to the over-ear mode, and until I adjusted the cable with the provided cable clips but ultimately I got it to my preferred fit.

I found the manual ( ) on the Jaybird site very useful and detailed. They also have getting started videos on their support page ( ).


Don't forget to register your Jaybird X2 on the Jaybird site for the Lifetime warranty against sweat by filling in this ( ) form with your purchase details, it only takes a minute.

Update (13-03-2016)

After a couple of weeks using the Jaybird X2 earphones I have to say that the battery life is great, but the bass is not to my liking as I prefer to have more bass. I have used both the silicon ear tips and the Comply premium sport ear tips but I haven't found the proper noise isolation set yet. I can definitely recommend these earphones for their hassle free setup and the wireless feature that was very important for me and I did not experience any problems with my iPhone 6 Plus.

VirtualBox - Failed to create the host-only adapter [OSX]

VirtualBox - Failed to create the host-only adapter [OSX]

This morning I went to fire up my local vagrant machine on OSX and I got the following error:

Bringing machine 'default' up with 'virtualbox' provider...
==> default: Checking if box 'laravel/homestead' is up to date...
==> default: Clearing any previously set network interfaces...
There was an error while executing `VBoxManage`, a CLI used by Vagrant
for controlling VirtualBox. The command and stderr is shown below.

Command: ["hostonlyif", "create"]

Stderr: 0%...
Progress state: NS_ERROR_FAILURE
VBoxManage: error: Failed to create the host-only adapter
VBoxManage: error: VBoxNetAdpCtl: Error while adding new interface: failed to open /dev/vboxnetctl: No such file or directory
VBoxManage: error: Details: code NS_ERROR_FAILURE (0x80004005), component HostNetworkInterface, interface IHostNetworkInterface
VBoxManage: error: Context: "int handleCreate(HandlerArg*, int, int*)" at line 66 of file VBoxManageHostonly.cpp

The solution for me was to remove VirtualBox, download a newer version from and reinstall it. After that vagrant up was working again.

In case it does not work try to update or reinstall vagrant too, but the main culprit was VirtualBox as it was not able to create any host adapters.

Wordpress - Send post data to external (3rd party) service

Wordpress - Send post data to external (3rd party) service

Did you ever want to send Wordpress post data as soon as a post is created, or published, or updated? Maybe even when the post is trashed or deleted? Using Wordpress hooks it's very easy to create a custom wordpress plugin, activate it from the administration area and immediately start sending the data to a 3rd (third) party or a custom external service.

Check how it's done

Ookla - Could not connect to test server issue

Ookla - Could not connect to test server issue

Recently I had to debug and issue with our hosted Ookla speed test application. To cut it short the flash application was loading fine, license key was correct too but when running the speed test it was showing a latency error like the one below.

First we thought the issue was a firewall issue, as it is stated clearly in the error message, and although there were issues with the firewall iptables but it was not the main issue that was causing the error. The issue was that the Ookla server daemon was not started so the application could not connect to the hosted Ookla server to run the test.

The solution was to run the ./OoklaServer --daemon and include the daemon in the boot scripts, so that whenever the hosting server is restarted the daemon would start automatically. This varies according to how you setup the Ookla server the first time.

To test if the Ookla server was working correctly I also used to make sure that the server was setup correctly.

You can find more information on the Ookla unix server daemon here .

If you want to setup the daemon to startup automatically follow the guide