Jump to content
sergio.costa

ANSWERED Versão Mobile VS Versão Desktop

Recommended Posts

sergio.costa

Boas pessoal...

Sou novo nestas andanças e estou com um problema que está dificil de resolver.

Estou a criar um site para colocar no webserver de um automato e estou a criar 2 versões Mobile e Desktop

Andei a pesquisar no TUBE como se faz isso e a maioria das pessoas usa o codigo abaixo.

acontece que na versão mobile funciona tudo 5 estrelas mas no browser desktop o browser está assumir o CSS da versão mobile

 

        content="width = device-width user-scalable=yes, initial-scale=0.8, maximum-scale=2.0, minimum-scale=0.5">
    <link rel="stylesheet" type="text/css" media="screen and (min-width: 413px)" href="./css/application_Desktop.css">
    <link rel="stylesheet" type="text/css" media="screen and (min-width: 300px)" href="./css/application_Mobile.css">
    <link rel="stylesheet" type="text/css" media="screen and (min-width: 413px)" href="./css/Index_Style_Desktop.css">
    <link rel="stylesheet" type="text/css" media="screen and (min-width: 300px)" href="./css/Index_Style_Mobile.css">

Quando tento inspecionar os elementos percebo que o browser está a assumir o "./css/application_Mobile.css" e não o "./css/application_Desktop.css"

Alguem me pode ajudar?

 

Share this post


Link to post
Share on other sites
Rui Carlos

Assim de repente, parece-me que estás a dizer para usar os estilos de desktop para dispositivos com pelo menos 413px, e os estilos de mobile para dispositivos com pelo menos 300px.  Qualquer dispositivo "desktop", com pelo menos 413px, também terá forçosamente mais de 300px, logo estás a dizer que os estilos mobile se aplicam aos desktops também.  E como no CSS as últimas declarações ganham, acabas com os estilos mobile a serem aplicados.

Inverter a ordem das declarações deve resolver o teu problema.

Share this post


Link to post
Share on other sites
sergio.costa

Boas... 

Desde já muito obrigado pela resposta.

Realmente era esse o problema. Troquei a ordem e ja ficou resolvido... 

Este é um daqueles casos em que se copia mas copia-se mal... 😁 

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

×
×
  • Create New...

Important Information

By using this site you accept our Terms of Use and Privacy Policy. We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.