I've got a set of social media icons that I'd like to display on the left side of the screen in a fixed position. I got this working properly, and it works on all browsers except for Firefox. I did some sleuthing, and found that the function I was using (calc(50%-64px)), had browser specific versions. So I've tried to add these to my SCSS file, but I'm getting sass compiler errors, saying my syntax is wrong.
This is an example of a class that is throwing an error. The error doesn't mention anything specific, just that it's a syntax error. It's definitely the browser specific functions, as when I remove them, everything compiles fine.
Am I missing something? I'm fairly new to SASS. I've done tons of digging and can't find a solution.
.linkedIcon {
@include icon($socialIcon);
position:fixed;
left:0;
/* Firefox */
top: -moz-calc(50% - 64px);
/* WebKit */
top: -webkit-calc(50% - 64px);
/* Opera */
top: -o-calc(50% - 64px);
/* Standard */
top: calc(50% - 64px);
background-image: url('icons/64/linkedIcon.png');
}
I'm receiving the following error when compiling (from comments)
An exception was thrown when compiling \SiteStyle.scss: System.Net.NetworkInformation.NetworkInformationException (0x80004005): Invalid access to memory location