problems with setting up wallpaper

Tags: css
Question!

okay so my problem is i set up a wallpaper but its getting cut off i have no idea what is wrong with it if someone could take a look at my code and tell me what is wrong i have tried removing the wallpaper from the main.html but no lock so far

      <!DOCTYPE html>
      <html>
      <head>
     <meta charset="utf-8">
     <title> Jihad Miski | Designer </title>
     <link rel="stylesheet" href="css/normalize.css">
     <link href="https://fonts.googleapis.com/css?family=Poiret+One" rel="stylesheet">
     <link rel="stylesheet" href="css/main.css">
   </head>
   <body>
     <header>
       <a href="main.html" id="logo">
         <h1>Jihad Miski</h1>
         <h2>Designer</h2>
       </a>
       <nav>
         <ul>
           <li><a href="main.html"></a></li>
           <li><a href="about.html" id="about">About</a></li>
           <li><a href="contact.html" id="contact">Contact</a></li>
        </ul>
      </nav>
      </header>
      <div id="wrapper">
      <section>
        <ul id="gallery">
          <li>
            <img src="img/wallpaper.jpg" alt="">
          </li>
        </ul>
      </section>
      <footer>
        <a href="http://instagram.com/ayrabfac"><img src="img/insta.jpeg" alt=""></a>
        <p>&copy; 2016 Jihad Miski </p>
          </footer>
        </div>
       </body>
     </html>











/*******************************************
*******************************************
***********    general    *******************
*******************************************
*******************************************/

body {
  font-family: 'Poiret One', sans-serif;

}



  #wrapper {
max-width: 930px;
margin: 0 auto;
padding: 0% 5%;
background-color: transparent;


}


a {
  text-decoration: none;
}


img {
  max-width: 100%;

}



body {
background-image: url('../img/wallpaper.jpg');
background-size: cover;
background-position: center center;
background-repeat: no-repeat;
}




/*******************************************
*******************************************
***********    positioning      ****************
*******************************************
*******************************************/

#logo {
  position: fixed; /* or absolute */
  top: 40%;
  left: 40%;
  margin: 0;
  }


  nav {
    text-align: center;     /* or absolute */
    top: 40% ;
    left: 40% ;
  }




/*******************************************
*******************************************
***********    font      *******************
*******************************************
*******************************************/


h1{
  font-family: 'Poiret One', sans-serif;
  margin: 15px 0;
  font-size: 3em;
  font-weight: normal;;
  line-height: 0.8em;
}

h2{
  font-family: 'Poiret One', sans-serif;
  margin: 30px 0;
  font-size: 1.24em;
  font-weight: normal;
  line-height: 0.8em;
}


/*******************************************
*******************************************
***********    color      *****************
*******************************************
*******************************************/

  a {
    color: #6ab47b;
  }

h1 , h2 {
  color: #fff;
}

#about {
  color: #808080;
}

#contact {
  color: #808080;
}



/*******************************************
*******************************************
***********    footer  *******************
*******************************************
*******************************************/

footer {
  font-size: 1em;
  text-align: center;
  padding-top: 50px;
  color: #808080;
}


Answers

I'm not having an issue when I ran your code locally. When you say 'getting cut off' are you referring to your picture (wallpaper.jpg)?

You can try setting your left and right img margins to auto.

img {
    max-width:100%;
    margin-left:auto;
    margin-right:auto;
}


Depends on how accurate you want the speedtest to be, the larger the file the more accurate it is. But this can be a big annoyance/data hog for the user.

The big number appears because it's in bytes, to get Mb/s you need to do Your result / 1024^2.



Disable attribute only associates button and input filelds, the thing you want to do here is , event.preventDefault . It will work like disable, but it will depend upon your coding, if you want to show it disabled, you have to add add via jquery



This video can help you solving your question :)
By: admin