Quando você faz algo assim:
.wrapper {
width: 960px;
margin: 0 auto;
}
O único problema:
quando temos uma janela estreita como em dispositivos móveis e a largura dos elementos de nível de bloco – como o div que você aplicou a classe .wrapper – é muito grande, o navegador cria uma rolagem horizontal e “respeita” a largura do elemento.
Por que não pare de usar larguras e apenas “limite” a área do seu .wrapper ?
.wrapper {
max-width: 960px;
margin: 0 auto;
}
Dessa forma, você não precisa se preocupar com pergaminhos malignos ou suporte ao navegador. É compatível com os principais navegadores:
http://caniuse.com/#search=max-width
PS: Inspecione esta página .wrapper e veja como funciona