網站沒有圍繞移動

我有我的網站上尋找所有時髦的桌面，但在移動設備上，它只是看起來可怕的頁面被推向左側，中心完全打破網站沒有圍繞移動

這裏是我的代碼

index.php文件：

<!DOCTYPE html> 




<!-- I know my codes messy --> 
<!-- If you dont agree and want to --> 
<!-- Hire me just need someone to speak to or think you can help --> 
<!-- Shoot me a email: [email protected] --> 
<!-- Or you can tweet me: @MarleyJPlant --> 




<html> 
    <head> 
     <meta name="description" content="MarleyJPlant Graphic Design Coding And Gaming" /> 
     <meta name="keywords" content="Marley Joseph Plant, MarleyPlant, Marley Plant, Marley, Arduduck, Simon Hedley, YRS, Young Rewired, Rewired State, Young Rewired State, YRS 2015, Best In Design, MarleyJPlant, Young Rewired Winner" /> 
     <meta name="author" content="metatags generator"> 
     <meta name="robots" content="index, follow"> 
     <meta name="revisit-after" content="1 days"> 
     <link rel=」author」 href=」https://plus.google.com/u/1/101486183104153864417/」/> 
     <title>Marley Joseph Plant</title> 
     <!-- Marley Plant, Marley Joseph Plant, MarleyJPlant --> 

     <meta content='width=device-width, initial-scale=1' name='viewport'/> 
     <link rel="stylesheet" href="css/main.css"> 
     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css"> 
     <link rel="stylesheet" href="http://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.4.0/css/font-awesome.min.css"> 
     <link rel="stylesheet" href="https://raw.githubusercontent.com/kswedberg/jquery-smooth-scroll/master/jquery.smooth-scroll.js"> 
     <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script> 
     <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.18/jquery-ui.min.js"></script> 
     <script type="text/javascript" src="js/navigate.js"></script> 
     <script type="text/javascript" src="js/Icons.js"></script> 
     <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
     <script src="http://css3-mediaqueries-js.googlecode.com/svn/trunk/css3-mediaqueries.js"></script> 
    </head> 
    <body> 
     <div class="MainPart"> 
     <div class="title"> 
      <center><h1 class="title" >Marley Plant</h1></center> 
     </div> 
     <br /> 
     <br /> 
     <br /> 
     <br /> 
     <br /> 
     <div class="social"> 
      <center> 
       <a href="http://facebook.com/MarleyJPlant" alt="Facebook" class="fa fa-facebook fa-5x Icon"></a> 
       <a href="http://twitter.com/MarleyJPlant" alt="Twitter" class="fa fa-twitter fa-5x Icon"></a> 
       <a href="http://github.com/MarleyPlant" alt="Github" class="fa fa-github fa-5x Icon"></a> 
       <a href="http://blog.marleyplant.com" alt="WordPress" class="fa fa-wordpress fa-5x Icon"></a> 
       <a href="https://vine.co/u/1245502532772581376" alt="Vine" class="fa fa-vine fa-5x Icon"></a> 
       <a href="https://www.youtube.com/channel/UCDoR3fPDtLjqgR_9fNPt_mw" alt="youtube" class="fa fa-youtube-play fa-5x Icon"></a> 
       <a href="http://steamcommunity.com/id/Flaffle" alt="steam" class="fa fa-steam fa-5x Icon"></a> 
       <a href="https://www.flickr.com/photos/[email protected]/" alt="Flickr" class="fa fa-flickr fa-5x Icon"></a> 
       <a href="http://instagram.com/marleyjplant/" alt="Instagram" class="fa fa-instagram fa-5x Icon"></a> 
       <a href="http://stackoverflow.com/users/5330908/marleyjplant?tab=profile" alt="Stack Overflow" class="fa fa-stack-overflow fa-5x Icon"></a> 
      </center> 
     </div> 
    </body> 

</html>

的main.css：

.title{ 
    color: #5E6973; 
    font-family: universe; 
    text-align: center; 
    font-size: 125px; 
} 

.MainPart{ 
     position: relative; 
     top: 50%; 
     transform: translateY(50%); 
} 

body{ 
    background-image: url("/images/background.jpg"); 
} 

::-webkit-scrollbar { 
    display: none; 
} 

.Icon{ 
    text-decoration: none; 
    padding-right: 40px; 
    padding-bottom: 30px; 
    color: #7CFFC4; 
    -webkit-transition-duration: 0.8s; 
    -moz-transition-duration: 0.8s; 
    -o-transition-duration: 0.8s; 
    transition-duration: 0.8s; 
    -webkit-transition-property: -webkit-transform; 
    -moz-transition-property: -moz-transform; 
    -o-transition-property: -o-transform; 
    transition-property: transform; 
    overflow:hidden; 
} 

.Icon:hover{ 
    -webkit-transform:scale(1.5,1.5); 
    -moz-transform:scale(1.5,1.5); 
    -o-transform:scale(1.5,1.5); 
} 

@font-face { 
    font-family: universe; 
    src: url('Universe.ttf'); 
} 

.social{ 
    align: center; 
} 

.jumbotron{ 
    background-image: url("/images/background2.png"); 
}

你可以找到比在http://marleyplant.com 我檢查我的iPhone 5的中心和一個真人版的我的諾基亞Lumia 920看起來都一樣

我使用這些庫的：

FontAwesome 的Jquery 引導程序

來源

2015-11-13 MarleyJPlant