Untitled

dabblet.css

* {
	box-sizing: border-box;
	}

.welcome, .main {
	height: 200px;
	width: 200px;
	}
.top, .bottom {
	display: inline-block;
	vertical-align: top;
	}
.welcome {
	background: dodgerblue;
	}
.main {
	background: pink;
	}
	
@media (max-width: 500px) {
	.page {
		display: table;
		}
	.top {
    	display: table-header-group; 
		}
	.bottom {
    	display: table-footer-group;
		}
	}

dabblet.html

<div class="page">
	<div class='bottom'>
    	<div class="welcome">
        	<span>Welcome to my page</span>
    	</div>
    </div>
    <div class='top'>
    	<div class="main">
        	<div class="header">
        	</div>
        	<div class="content">
        	</div>
    	</div>
    </div>
</div>

dabblet.js

// alert('Hello world!');

settings.json

{"view":"separate","fontsize":"100","seethrough":"","prefixfree":"1","page":"all"}