CSS segun qué pantalla

[caraplo]

Hola a todos,

me gustaria saber cómo puedo hacer para que los navegadores usen un fichero css concreto segun la resolucion de pantalla que usen, ya que estoy maquetando una web y cambiando de resolucion me varian los posicionamientos de los bloques.

Da igual si es css, php o javascript.

Además me gustaria saber si es posible cómo usar un fichero css segun el navegador con el que se visualice, para mostrar css especificos en cada caso.

Espero que puedan ayudarme.

Un saludo a todos, gracias.

[JavierB]

Hola caraplo

Puedes llamar a tus archivos .css según las distintas resoluciones de pantalla: 800.css 1024.css etc. y utilizar este código:

Código:

<script type="text/javascript">
document.write('<link rel="stylesheet" type="text/css" href="'+ screen.width +'.css" />');
</script>

Mensaje movido al foro de JavaScript desde Css.

Saludos,

[caraplo]

Muuuuchas gracias tio, FUNCIONA!

[marcopoloaz06]

y si mi pantalla no es de 800 ni de 1024 ??

[JavierB]

Hola marcopoloaz06

Si tu pantalla es de 975 (es un ejemplo), puedes llamar a tu archivo de estilos 975.css y utilizar el mismo código.

Saludos,

[pinchoso]

Respondiendo en parte a marcopoloaz06, yo lo que haria es definir unos "rangos" en los que definiremos que css usar.

rollo:

Código:

var css;
if ((screen.width>700) && (screen.width<900))
     css = '800.css';
if ((screen.width>900) && (screen.width<1100))
     css = '1024.css';

Asi en todas las resoluciones que quieras tener en cuenta, a mi me parece una buena solución la que ha dado JavierB

Saludos,
pinchoso

[marcopoloaz06]

Excelete ya lo iba a preguntar
Graciaz!
tE molesto si lo pones todo junto con el código de javierB??
Esk yo no se nada de eSto Gracias

[pinchoso]

Hola, pues es bastante sencillo:

Código:

 
<script type="text/javascript">
 
var css;
if ((screen.width>700) && (screen.width<900))
     css = '800.css';
if ((screen.width>900) && (screen.width<1100))
     css = '1024.css';
 
//también deberiamos tener en cuenta el caso que no entre en ninguna de las condiciones:
if (css == undefined)
     css = '1280.css';
 
document.write('<link rel="stylesheet" type="text/css" href="'+ css +'" />');
 
</script>

piensa bien que resoluciones vas a utilizar y cuales van a ser los "rangos" que vas a utilizar.

Saludos,
pinchoso