VERSION-8

by velo_ninja

HTML

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Basic HTML Structure</title>
      <style>
        body {
          display: flex;
          justify-content: space-evenly;
          align-items: center;
          padding: 5px;                    
          overflow-y: auto;         
        } 
        .section-main{
          flex-direction: column;
          padding: 5px;    
        } 
        .section-title {   }
        .div-title {
          font-family: "Roboto", sans-serif;
          font-size: 25px;
          font-weight: bold;      
        }
        .div-version {          
          font-size: 15px;
          font-weight: bold;
        }
        .section-header {   }
        .section-body {
          flex-direction: column;
          padding: 10px 0px 10px 0px;         
          max-width: auto;
        }        

      </style>
            
      <script>
      
      
      
      	function init_Body() {BODY = document.body; return BODY}
        
        
      
      	function createNewDiv(target, divID, options) {let parentDiv;
        	let newDiv = document.createElement('div');       
        	// Check if target is a string or a DOM element
          if (typeof target === 'string') {parentDiv = document.getElementById(target);} 
          else if (target instanceof HTMLElement) {parentDiv = target;} 
          else {throw new Error('Target must be either a string or a DOM element.');}    
         	//----------------------------------------------------------------------     
          if (divID) 										{newDiv.id = divID; newDiv.className = divID.replace(/([A-Z])/g, '-$1').toLowerCase();}
          if (options.width) 						{newDiv.style.width = options.width;}
          if (options.height) 					{newDiv.style.height = options.height;}
          if (options.color) 						{newDiv.style.color = options.color;}
          if (options.content)...