title: html/css to fit all screen resolution
body: <p>I'm working on the website and I'm trying to make it responsive to all resolutions but without success..</p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-css lang-css prettyprint-override"><code>body {
    width:1920px;
    background-color: #f8e0b3;
    height:1080px;
  }
    
  div.container {
    width:100%;
      height:100%;
  }
      
  div.header {
      background:url(img/header.jpg);
      width:100%;
      height:46%;
    margin-top:;
    margin-left:;
    border-bottom: 2px solid black;
  }
      
  h1.naslov {
    font-size:60px;
    color:white;
    margin:0 auto;
    margin-left:28%;
    font-family: Aramis;
  }
      
  p.naslov-text {
      font-size:40px;
      color:#634ea9;
      margin:0 auto;
      width:1000px;
      margin-top:0%;
      margin-left:36%;
      font-family: Aramis;
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;body&gt;
    &lt;div class = "container"&gt;
      &lt;div class = "header"&gt;
        &lt;h1 class = " naslov "&gt; Lorem ipsum nasov je? &lt;/h1&gt;
          &lt;p class = "naslov-text"&gt;
              "Lorem ipsum dolor sit amet, consectetur adipisicing elit." 
          &lt;/p&gt;
       &lt;/div&gt;
    &lt;/div&gt;
  &lt;/body&gt;</code></pre>
  </div>
  </div>
  </p>
  <p>When I resize my browser website doesn't resize. I've been trying all morning and I'm really burnout. Do anyone know what logic to approach to make this fit all screens , but only using css.</p>