<style> .filecheckbox { margin: 0px; min-width: 20px } .filekey { min-width: 200px; } .filevalue { flex-grow: 1; width: 25%; min-width: 200px; } .filenumberbox { min-width: 50px; flex-grow: 1; } .filetitle { border-top-style: dotted; flex-grow: 1; } .fileentryouter { flex-grow: 1; width: 100%; } </style> <div class="subtitle">Files:</div> <div class="flexcontainer"> <div class="filekey">Total Size</div> <div id="filetotalsize" class="filevalue"></div> </div> <div class="flexcontainer"> <div class="filekey">Used Size</div> <div id="fileusedsize" class="filevalue"></div> </div> <div class="flexcontainer"> <div class="filekey">Free Size</div> <div id="filefreesize" class="filevalue"></div> </div> <br> <div class="flexcontainer" style="border-left-style: double; border-right-style: double; border-top-style: double;"> <div class="subtitle" >Upload:</div> </div> <div class="flexcontainer" style="border-left-style: double; border-right-style: double;"> <div class="flexcontainer"> <div class="filekey"> File: </div> <input id="fileuploadfile" class="filevalue" type="file"> </div> <div class="flexcontainer"> <div class="filekey"> Name: </div> <input id="fileuploadname" class="filevalue" type="text"> </div> </div> <div class="flexcontainer" style="border-left-style: double; border-right-style: double; border-bottom-style: double;"> <button id="fileuploadbtn" class="subtitle">Upload</button> </div> <br> <div class="flexcontainer" style="border-left-style: double; border-right-style: double; border-top-style: double;"> <div class="subtitle">List:</div> </div> <div id="fileList" class="flexcontainer" style="border-left-style: double; border-right-style: double; border-bottom-style: double;"> </div>