Generated by SassMeister.com.

SassMeister-input-HTML.haml

.container
  %span.content Lorem Ipsum

.container
  %span.content-2 Dolor Sit Amet

SassMeister-input.scss

// ----
// Sass (v3.4.13)
// Compass (v1.0.3)
// Scut (v1.1.2)
// ----

@import "scut";
@import "compass/css3";

@mixin divider {
  &:before {
    @include scut-absolute(0 n 0 50%);
    width: 1px;
    background: blue;
    content: '';
  }
}

.container {
  position: relative;
  margin-bottom: 20px;
  width: 400px;
  height: 200px;
  border: 1px solid #999;
  
  @include divider;
  
}
  .content, .content-2 {
    @include scut-absolute(40% n n 50%);
    @include transform(translateX(-50%));
    @include transform-origin(50% 50% 0);
    background: red;
    display: inline-block;
    padding: 10px;
    color: #333;
    
    @include divider;
  }
  
  .content:hover {
    @include transform(translateX(-50%) scale(1.2));
  }
  .content-2:hover {
    @include transform(scale(1.2) translateX(-50%));
  }
  

SassMeister-output.css

/*
* Scut, a collection of Sass utilities
* to ease and improve our implementations of common style-code patterns.
* v1.1.2
* Docs at http://davidtheclark.github.io/scut
*/
.container {
  position: relative;
  margin-bottom: 20px;
  width: 400px;
  height: 200px;
  border: 1px solid #999;
}
.container:before {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 50%;
  width: 1px;
  background: blue;
  content: '';
}

.content, .content-2 {
  position: absolute;
  top: 40%;
  left: 50%;
  -moz-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
  -moz-transform-origin: 50% 50% 0 50%;
  -ms-transform-origin: 50% 50% 0 50%;
  -webkit-transform-origin: 50% 50% 0 50%;
  transform-origin: 50% 50% 0 50%;
  background: red;
  display: inline-block;
  padding: 10px;
  color: #333;
}
.content:before, .content-2:before {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 50%;
  width: 1px;
  background: blue;
  content: '';
}

.content:hover {
  -moz-transform: translateX(-50%) scale(1.2);
  -ms-transform: translateX(-50%) scale(1.2);
  -webkit-transform: translateX(-50%) scale(1.2);
  transform: translateX(-50%) scale(1.2);
}

.content-2:hover {
  -moz-transform: scale(1.2) translateX(-50%);
  -ms-transform: scale(1.2) translateX(-50%);
  -webkit-transform: scale(1.2) translateX(-50%);
  transform: scale(1.2) translateX(-50%);
}

SassMeister-rendered.html

<div class='container'>
  <span class='content'>Lorem Ipsum</span>
</div>
<div class='container'>
  <span class='content-2'>Dolor Sit Amet</span>
</div>