builder_top.html

<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
* {
  box-sizing: border-box;
}

.container {
    /* display:flex;
    flex-wrap:wrap;
    flex-direction:row;
    justify-content:flex-start;
    align-items:stretch; */
    width:100%;
    min-height:100%;
}

#wyg {
    min-height:400px;
    border-bottom: 1px solid black;
    border-top: 1px solid black;
}
#elementList {
    min-height:80px;
    max-width:1024px;
    background:lightgrey;
    display:grid;
    grid-template-columns: repeat( auto-fit, minmax(250px, 1fr) );
    padding:8px;
}
#groupList {
    max-width:1024px;
    min-height:80px;
    background:grey;
    display:grid;
    grid-template-columns: repeat( auto-fit, minmax(250px, 1fr) );
    padding:8px;
}
#settings {
    max-width:1024px;
    min-height:200px;
    background:lightgrey
}
#settings::before {
   content: "Settings";
}

.element {
    border: 1px solid black; 
    margin:4px;
    padding:4px;
    height:2em;
    display:inline-block;
}

.group {
    height:3em;
    border: 1px solid black;
    display:inline-block;
    margin:4px;
    padding:4px;
}


</style>
</head>
<body>