node package manager
Share your code. npm Orgs help your team discover, share, and reuse code. Create a free org »


Less border layout example

This example shows how to do border layouts using Less mixins.

Border layout

You can see the example here.


    <!DOCTYPE html>
        <link rel="stylesheet/less" type="text/css" href="style.less">
        <script src="less.js" type="text/javascript"></script> 
        <div class="layout main">
          <div class="layout top"></div> 
          <div class="layout left"></div> 
          <div class="layout center content">
            <div class="layout top"></div> 
            <div class="layout center"></div> 
            <div class="layout right"></div> 
          <div class="layout right"></div> 
          <div class="layout bottom"></div> 


@import "../layouts.less";
@import "../border-layout.less";

.layout.main {
    min-width: 600px;
    min-height: 400px;

    .content {

Advanced example

Click here to open the advanced example

Border layout example