<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Search</title> <link title="Youtube local" href="/youtube.com/opensearch.xml" rel="search" type="application/opensearchdescription+xml"> <style type="text/css"> body{ margin:0; padding: 0; color:#222; //background-color:#888888; background-color:#cccccc; min-height:100vh; display:grid; grid-template-columns: 3fr 1fr; grid-template-rows: 50px 1fr; } h3{ margin:0; } #header{ grid-column: 1 / span 3; grid-row: 1; grid-template-columns: 3fr 1fr; } #header-left{ display:grid; grid-template-columns: 1fr 800px; } #left{ grid-column: 1; grid-row: 1; #right{ grid-column: 2; grid-row: 1; } </style> </head> <body> <div id="header"> <div id="header-left"> <form id="search-form" action="/youtube.com/search"> <input type="text" name="query" id="search-box"> <input type="submit" value="Search" id="search-button"> </form> </div> </div> <div id="left"> </div> <div id="right"> </div> </body> </html>