Navigation Menu

Skip to content

Instantly share code, notes, and snippets.

@piscis
Created June 1, 2015 15:05
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save piscis/9ecb7448976f40fb9e5a to your computer and use it in GitHub Desktop.
Save piscis/9ecb7448976f40fb9e5a to your computer and use it in GitHub Desktop.
Generated by SassMeister.com.
// ----
// Sass (v3.4.12)
// Compass (v1.0.3)
// ----
@function convert($value, $currentUnit, $convertUnit){
@if $currentUnit == px{
@if $convertUnit == ems{
@return $value / 16+em;
}
@else if $convertUnit == percent{
@return percentage($value / 16);
}
}@else if $currentUnit == ems{
@if $convertUnit == px{
@return $value * 16+px;
}
@else if $convertUnit == percent{
@return percentage($value);
}
}@else if $currentUnit == percent{
@if $convertUnit == px{
@return $value * 16 / 100+px;
}
@else if $convertUnit == ems{
@return $value / 100+em;
}
}@else if $currentUnit == pts{
@if $convertUnit == px{
@return $value * 1.3333+px;
}
@else if $convertUnit == ems{
@return $value / 12+em;
}
@else if $convertUnit == percent{
@return percentage($value / 12)
}
}
}
.example1{
font-size: convert(18, px, percent); /* converted from pixels */
}
.example2{
font-size: convert(13, pts, ems); /* converted from points */
}
.example3{
font-size: convert(2.5, ems, px); /* converted from ems */
}
.example4{
font-size: convert(234, percent, px); /* converted from percentage */
}
.example1 {
font-size: 112.5%;
/* converted from pixels */
}
.example2 {
font-size: 1.08333em;
/* converted from points */
}
.example3 {
font-size: 40px;
/* converted from ems */
}
.example4 {
font-size: 37.44px;
/* converted from percentage */
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment