Ir para conteúdo

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

Lauro Adriano Alves

Design responsivo funciona em navegador, mas não em celular

Recommended Posts

Saudações a todos, estou reformulando o visual de meu site (desmorto.com) e estou trabalhando para que ele fique responsivo para se adequar aos mais diversos dispositivos.

 

Já adianto que sou autodidata, então tem muita coisa que desconheço.

 

Continuando, nos testes que estou fazendo redimensionando a janela do navegador, tudo está correndo bem. Porém ao entrar no site via celular ou tablet, ele insiste em ficar com o visual de browser.

 

O código que estou usando no style.css é :

 

@media all and (max-width: 680px) {

 

}

 

No meu entender, com esse código, se a largura da tela/navegador for de no maximo 680 px, ele mostra a página no estilo entre as chaves. Se não for, ele mostra o estilo restante do style.css.

 

Depois de ver um tutorial na net, estou testando também:

 

@media all and (max-width: 680px), @media only screen and (max-device-width : 680px) {

}

 

Mas mesmo assim, não dá certo.

 

Importante: não sei se é relevantes, mas estou usando o site para a plataforma wordpress, e para testar o site, estou usando um plugin chamado "Theme Test Drive", que permite que os Administradoras visualizem determinado tema (no caso o novo visual que estou testando).

 

Att.

 

Compartilhar este post


Link para o post
Compartilhar em outros sites

vc colocou a metagtag viewport ?

 

estude sobre ela.

Compartilhar este post


Link para o post
Compartilhar em outros sites

Acho que deu certo, finalmente está funcionando em celular. Só notei que algumas coisas estão bugadas (elementos que não deveriam aparecer, ainda estão), mas agora está facil de resolver.

 

Valeu.

 

Obs: li a respeito do viemport em http://blog.caelum.com.br/pixels-pixels-ou-pixels-dicas-de-web-mobile-com-viewport/

Compartilhar este post


Link para o post
Compartilhar em outros sites
3 minutos atrás, Chrystian Figueiredo disse:

Boa tarde amigos, voces poderiam me ajudar?

meu site é esse www.cfigueiredo.com

Todo o site funciona responsivo, porem a pagina principal não funciona.

 

 

Não precisava reviver um post antigo do fórum, mas testei aqui e parece estar responsivo sim :P

Compartilhar este post


Link para o post
Compartilhar em outros sites
3 horas atrás, rikaschmitt disse:

 

Não precisava reviver um post antigo do fórum, mas testei aqui e parece estar responsivo sim :P

Eu não entendo muito e percebi que existe a possibilidade de colocar um CSS adicional

Alguém poderia me passar o código ?

Poque isso acontece somente na pagina principal, ele dimensiona ate um ponto e depois no celular da pau

Compartilhar este post


Link para o post
Compartilhar em outros sites

Já que deram res no tópico a solução é como o bruno disse, adicionar ao head

<meta name="viewport" content="width=device-width, initial-scale=1">

 

Compartilhar este post


Link para o post
Compartilhar em outros sites

×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.