Windy CSS styleguide

9 #margins Margins

Handy margin classes for spacing elements. Use only in case, you do not style your elements in other way.

Source: src/css/core/margins.less, line 1

9.1 #margins.1 .m-{number}

Define overall margin in pixels

Parameters:
  • .m-0
    margin: 0;
  • .m-1
    margin: 1px;
  • .m-2
    margin: 2px;
  • .m-3
    margin: 3px;
  • .m-4
    margin: 4px;
  • .m-5
    margin: 5px;
  • .m-6
    margin: 6px;
  • .m-7
    margin: 7px;
  • .m-8
    margin: 8px;
  • .m-9
    margin: 9px;
  • .m-10
    margin: 10px;
  • .m-15
    margin: 15px;
  • .m-20
    margin: 20px;
  • .m-30
    margin: 30px;
  • .m-40
    margin: 40px;
Source: src/css/core/margins.less, line 8

9.2 #margins.2 .ml-{number}

Define margin left in pixels

Parameters:
  • .ml-0
    margin-left: 0;
  • .ml-1
    margin-left: 1px;
  • .ml-2
    margin-left: 2px;
  • .ml-3
    margin-left: 3px;
  • .ml-4
    margin-left: 4px;
  • .ml-5
    margin-left: 5px;
  • .ml-6
    margin-left: 6px;
  • .ml-7
    margin-left: 7px;
  • .ml-8
    margin-left: 8px;
  • .ml-9
    margin-left: 9px;
  • .ml-10
    margin-left: 10px;
  • .ml-15
    margin-left: 15px;
  • .ml-20
    margin-left: 20px;
  • .ml-30
    margin-left: 30px;
  • .ml-40
    margin-left: 40px;
Source: src/css/core/margins.less, line 76

9.3 #margins.3 .mr-{number}

Define margin right in pixels

Parameters:
  • .mr-0
    margin-right: 0;
  • .mr-1
    margin-right: 1px;
  • .mr-2
    margin-right: 2px;
  • .mr-3
    margin-right: 3px;
  • .mr-4
    margin-right: 4px;
  • .mr-5
    margin-right: 5px;
  • .mr-6
    margin-right: 6px;
  • .mr-7
    margin-right: 7px;
  • .mr-8
    margin-right: 8px;
  • .mr-9
    margin-right: 9px;
  • .mr-10
    margin-right: 10px;
  • .mr-15
    margin-right: 15px;
  • .mr-20
    margin-right: 20px;
  • .mr-30
    margin-right: 30px;
  • .mr-40
    margin-right: 40px;
Source: src/css/core/margins.less, line 144

9.4 #margins.4 .mt-{number}

Define margin top in pixels

Parameters:
  • .mt-0
    margin-top: 0;
  • .mt-1
    margin-top: 1px;
  • .mt-2
    margin-top: 2px;
  • .mt-3
    margin-top: 3px;
  • .mt-4
    margin-top: 4px;
  • .mt-5
    margin-top: 5px;
  • .mt-6
    margin-top: 6px;
  • .mt-7
    margin-top: 7px;
  • .mt-8
    margin-top: 8px;
  • .mt-9
    margin-top: 9px;
  • .mt-10
    margin-top: 10px;
  • .mt-15
    margin-top: 15px;
  • .mt-20
    margin-top: 20px;
  • .mt-30
    margin-top: 30px;
  • .mt-40
    margin-top: 40px;
Source: src/css/core/margins.less, line 212

9.5 #margins.5 .mb-{number}

Define margin bottom in pixels

Parameters:
  • .mb-0
    margin-bottom: 0;
  • .mb-1
    margin-bottom: 1px;
  • .mb-2
    margin-bottom: 2px;
  • .mb-3
    margin-bottom: 3px;
  • .mb-4
    margin-bottom: 4px;
  • .mb-5
    margin-bottom: 5px;
  • .mb-6
    margin-bottom: 6px;
  • .mb-7
    margin-bottom: 7px;
  • .mb-8
    margin-bottom: 8px;
  • .mb-9
    margin-bottom: 9px;
  • .mb-10
    margin-bottom: 10px;
  • .mb-15
    margin-bottom: 15px;
  • .mb-20
    margin-bottom: 20px;
  • .mb-30
    margin-bottom: 30px;
  • .mb-40
    margin-bottom: 40px;
Source: src/css/core/margins.less, line 280