Edit in JSFiddle

Vertical
<d-linear-layout style="height: 300px">    
    <div class="fill red">A</div>
    <div class="fill blue">B</div>
    <div class="fill green">C</div>
</d-linear-layout> 
Horizontal
<d-linear-layout vertical="false">    
    <div class="fill red">A</div>
    <div class="fill blue">B</div>
    <div class="fill green">C</div>
</d-linear-layout> 
html, body {
    width: 100%;
    height: 100%;
}

* {
    box-sizing: border-box; 
    margin: 0;
    padding: 0;
}

.red { background-color: #D9534F; }
.blue { background-color: #5BC0DE; }
.green { background-color: #5CB85C;}
require.config({
    baseUrl: "http://ibm-js.github.io/libraries/master"
});
require(["deliteful-build/layer"], function () {
    require([
        "deliteful/LinearLayout"
    ], function (){
        document.body.style.display = "";
    });
});