@phoenix-plugin-registry/swmitra.html-designer/responsive/html/fluidGridTemplate.html

NOW WITH RESPONSIVE DESIGN TOOLS (BETA)! Design and customize web ui with HTML and CSS. Now with taggable Design snippet/bookmark support.

<style>
    
.fluidGridPlane div {
    pointer-events: none;
}
    
.fluidGridPlane .fluidColumn {
    position:relative;
    margin-left: 0px;
    float: left;
    display: inline-block;
    width: @sectioncomputed;
    background: lightskyblue;
    opacity:0.2;
    height:100%;
}
    
.fluidGridPlane .leftContentPad {
    position:relative;
    margin-left: @gutter;
    float: left;
    display: inline-block;
    width: @contentpadding;
    background: blue;
    opacity:0.1;
    height:100%;
}
    
.fluidGridPlane .rightContentPad {
    position:relative;
    margin-left: 0px;
    float: left;
    display: inline-block;
    width: @contentpadding;
    background: blue;
    opacity:0.1;
    height:100%;
}
    
.fluidGridPlane div.activeGrid {
    opacity: 0.4;
}

</style>