pip-webui/pip-webui-css/src/positions/positions_mixins.less

HTML5 UI for LOB applications

// @file Positions mixins
// @copyright Digital Living Software Corp. 2014-2015

// Clearfix
//
// For modern browsers
// 1. The space content is one way to avoid an Opera bug when the
//    contenteditable attribute is included anywhere else in the document.
//    Otherwise it causes space to appear at the top and bottom of elements
//    that are clearfixed.
// 2. The use of `table` rather than `block` is only necessary if using
//    `:before` to contain the top-margins of child elements.
//
// Source: http://nicolasgallagher.com/micro-clearfix-hack/

.clearfix() {
  &:before,
  &:after {
    content: " "; // 1
    display: table; // 2
  }
  &:after {
    clear: both;
  }
}

// Center-align a block level element
.center-block() {
  display: block;
  margin-left: auto;
  margin-right: auto;
}

// CSS3 Content Columns
.content-columns(@column-count; @column-gap: @grid-gutter-width) {
  -webkit-column-count: @column-count;
     -moz-column-count: @column-count;
          column-count: @column-count;
  -webkit-column-gap: @column-gap;
     -moz-column-gap: @column-gap;
          column-gap: @column-gap;
}


// Positioning
//--------------

.position-relative() {
  position: relative !important;
}

.position-fixed() {
  position: fixed;
  top: 0;
  left:  0;
  right:  0;
}

.position-absolute(@top, @left, @right, @bottom) {
  position: absolute;
  top: @top;
  left: @left;
  right: @right;
  bottom: @bottom;
}

.position-fill() {
  .position-absolute(0, 0, 0, 0)
}

.position-top() {
  .position-absolute(0, 0, 0, none)
}

.position-bottom() {
    position: absolute;
    bottom: 0;
    left:  0;
    right:  0;
}