title: Responsive web design - add correct media queries
body: <p>I developed a website with wordpress and its design is fine for desktop and tablet, but when it comes the phone's visualization I have problems in setting a good design.
  I am trying to add a media query but I am not able to control the elements as I want. In specific (I am testing it with an Iphone5): the nav bar does not cover the full screen in the vertical view, the image is not centered, and the texts' margins are wrong... 
  Here is an HTML example of the homepage:</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
  &lt;head&gt;
  &lt;meta name="viewport" content="width=content-width, initial-scale=1.0"&gt;
  &lt;style&gt;
    #logo {
      display: none;
    }
  
    div img {
      display: inline;
    }
  
    div footer-area {
      display: none;
    }
  
  @media only screen and (max-width: 320px) {
      img {
        float: center;
    }
  
    div p {
      margin: 0;
      padding: 15px;
      width: 100%;
    }
  }
  &lt;/style&gt;
  
  &lt;img style="margin: -76px auto -55px auto; max-width: 450px;" src="http://localhost/wp/wp-content/uploads/2017/09/logo.png" alt="" width="1800" height="903" class="aligncenter size-full wp-image-461" /&gt;
  &lt;/head&gt;
  &lt;body&gt;
  &lt;div&gt;[smartslider3 slider=4]&lt;/div&gt;
  &lt;p style=" margin:70px 160px 0 160px;"&gt;&lt;strong&gt;Dottore Commercialista e Revisore Legale con sede a Verona&lt;/strong&gt;, Alberto Nesso offre ai propri clienti una vasta gamma di prestazioni professionali di livello qualitativamente elevato entro un prezzo medio di mercato. L'attività di consulenza ordinaria contabile e fiscale, integrata all'occorrenza da servizi di assistenza amministrativa e aziendale-societaria, si rivolge ad imprese individuali, società di persone e capitali, enti no profit. Prestando attenzione alle esigenze di ciascun cliente, vengono fornite le informazioni specifiche, per massimizzare i risultati e le risoluzioni dei problemi, nella massima trasparenza e attraverso procedure giuridiche e fiscali coerenti con la strategia aziendale.&lt;/p&gt;
  &lt;div style="margin: 30px 50px; " align="center"&gt;&lt;a href="http://www.albertonesso.it/profilo/" target="_blank"&gt;&lt;img style="padding-right: 10px; width: 240px;" src="http://www.albertonesso.it/wp-content/uploads/2017/09/HOME-profilo2.png" /&gt;&lt;/a&gt;&lt;a href="http://www.albertonesso.it/competenze/" target="_blank"&gt;&lt;img style="padding-right: 5px; padding-left: 5px; width: 240px;" src="http://www.albertonesso.it/wp-content/uploads/2017/09/HOME-competenze2.png" /&gt;&lt;/a&gt;&lt;a href="http://www.albertonesso.it/contatti/"target="_blank"&gt;&lt;img style="padding-left: 10px; width: 240px;" src="http://www.albertonesso.it/wp-content/uploads/2017/09/HOME-contatti2.png" /&gt;&lt;/a&gt;&lt;/div&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>Here the website address: <a href="https://www.albertonesso.it" rel="nofollow noreferrer">https://www.albertonesso.it</a></p>
  
  <p>Could you please help me in solving this issue?
  Thanks in advance!</p>