Foros del Web » Creando para Internet » CSS »

Usar 2 hojas de estilo en la misma pagina

Estas en el tema de Usar 2 hojas de estilo en la misma pagina en el foro de CSS en Foros del Web. Ayy en que lio me metí. Les cuento, digamos que todas las paginas del sitio usan la hoja "style.css" Hoy tuve que agregar una pequeña ...
  #1 (permalink)  
Antiguo 01/07/2009, 13:31
 
Fecha de Ingreso: junio-2008
Ubicación: Capital Federal xD
Mensajes: 1.208
Antigüedad: 9 años, 5 meses
Puntos: 35
Usar 2 hojas de estilo en la misma pagina

Ayy en que lio me metí.
Les cuento, digamos que todas las paginas del sitio usan la hoja "style.css"
Hoy tuve que agregar una pequeña agenda (Calendar) hecha en css muy vistosa.
Dicha agenda usa su propio hoja de estilos, llamemosle "calendar-system.css"
Por lo tanto tuve que declarar 2 hojas en el head:
Código PHP:
<link rel="stylesheet" type="text/css" href="style.css">
<
link rel="stylesheet" type="text/css" media="all" href="calendar-system.css" /> 
Y resulta que en style.css todas las tables abarcan el 100% del ancho, y cuando aparece la agenda, ésta aparece estirada al 100%!!!!
Perdiendo su tamaño original.
Como soy novato en css me gustaria saber como solucionar ésto.
Les copio el codigo que corresponde al area del input con la agenda en cuestión.
Gracias!!!
Código PHP:
<input name="fecha_desde" type="text" id="fecha_desde" value="<?=($_POST['fecha_desde'])?$_POST['fecha_desde']:date('d-m-Y'); ?>" size="9"  readonly/>
    <script type="text/javascript">
        Calendar.setup({
        inputField  :    "fecha_desde",    
        ifFormat    :    "%d-%m-%Y",    
        button      :    "fecha_desde",    
        align       :    "Bl",
        singleClick :    true
        });
    </script>
__________________
I am Doyle please insert code.
  #2 (permalink)  
Antiguo 01/07/2009, 13:52
Colaborador
 
Fecha de Ingreso: junio-2007
Mensajes: 5.798
Antigüedad: 10 años, 6 meses
Puntos: 538
Respuesta: Usar 2 hojas de estilo en la misma pagina

Aumenta la selectividad en los selectores del calendario.
Código css:
Ver original
  1. #calendario {width:XXpx; ...}
  2. #calendario table {...}
  3. #calendario table td {...}
  4. #calendario table td a {...}

Te dejo unos ejemplos de calendarios "de pillar y usar" por si te sirven de guía

Un saludo
__________________
Por una web con mucho estilo
+++ CUENTA ABANDONADA. ¿la quieres? +++
  #3 (permalink)  
Antiguo 01/07/2009, 14:04
 
Fecha de Ingreso: junio-2008
Ubicación: Capital Federal xD
Mensajes: 1.208
Antigüedad: 9 años, 5 meses
Puntos: 35
Respuesta: Usar 2 hojas de estilo en la misma pagina

El problemas es que dicho calendario posee muuuuuchas lineas de estilo y en javascript tiene 1871 lineas cuando se crea el calendario .
Los selectores del calendario no puedo tocarlo.
El problemas está en style.css, esta linea es el problema:
Código PHP:
table    {width:100&#37;;} 
no puedo modificarla porque se aplica a todas las tablas del sitio.
Se podria decirle al script javascript que utilice calendar-system.css? y que no utilice style.css
__________________
I am Doyle please insert code.
  #4 (permalink)  
Antiguo 01/07/2009, 14:37
Colaborador
 
Fecha de Ingreso: junio-2007
Mensajes: 5.798
Antigüedad: 10 años, 6 meses
Puntos: 538
Respuesta: Usar 2 hojas de estilo en la misma pagina

Tú ya estás dando un identificador único al "campo" donde vas a mostrar el calendario:
Cita:
<input name="fecha_desde" type="text" id="fecha_desde" value="
Entonces, en el css del calendario tendrías que añadir a todos los selectores algo así:
Cita:
#fecha_desde table {width: /*la anchura necesaria y el resto de de propiedades */}
Pero mejor sería si tienes esa página en red, que pusieses un enlace, o como mínimo, el inicio del código generado en el navegador del calendario y y algo de su css implicado.

Un saludo
__________________
Por una web con mucho estilo
+++ CUENTA ABANDONADA. ¿la quieres? +++
  #5 (permalink)  
Antiguo 01/07/2009, 15:09
 
Fecha de Ingreso: junio-2008
Ubicación: Capital Federal xD
Mensajes: 1.208
Antigüedad: 9 años, 5 meses
Puntos: 35
Respuesta: Usar 2 hojas de estilo en la misma pagina

Al final tuve que meter mano en calendar-system.css
Código PHP:
.calendar table {
  ..........
  ..........
  ..........
  
width:122px;<-------

Pero me queda una duda. En el siguiente codigo hace referencia a los table de calendar?
Código PHP:
.calendar table .wn {
  
padding2px 3px 2px 2px;
  
border-right1px solid ButtonShadow;
  
backgroundButtonFace;
  
colorButtonText;

__________________
I am Doyle please insert code.
  #6 (permalink)  
Antiguo 01/07/2009, 15:20
Colaborador
 
Fecha de Ingreso: junio-2007
Mensajes: 5.798
Antigüedad: 10 años, 6 meses
Puntos: 538
Respuesta: Usar 2 hojas de estilo en la misma pagina

Cita:
Pero me queda una duda. En el siguiente codigo hace referencia a los table de calendar?
Código PHP:
.calendar table .wn {
  
padding2px 3px 2px 2px;
  
border-right1px solid ButtonShadow;
  
backgroundButtonFace;
  
colorButtonText;

Ese código le está diciendo que a las clases wn que estén dentro de una table metida dentro de calendar le aplique esas propiedades.
Eso afectará a:
Cita:
<div class="calendar">
<table>
<tr>
<td class="wn">contenido al que se le aplican las propiedades</td>
<td class="otra"> este contenido ya no se ve afectado</td>
</tr>
</table>
</div>
Y lo siguiente tampoco se vería afectado:
Cita:
<div class="calendar">
<div class=wn> hola</div
</div>
Por eso te decía en mi primera respuesta que aumentases la selectividad de los selectores.

Un saludo
__________________
Por una web con mucho estilo
+++ CUENTA ABANDONADA. ¿la quieres? +++
  #7 (permalink)  
Antiguo 01/07/2009, 15:36
 
Fecha de Ingreso: junio-2008
Ubicación: Capital Federal xD
Mensajes: 1.208
Antigüedad: 9 años, 5 meses
Puntos: 35
Respuesta: Usar 2 hojas de estilo en la misma pagina

Si, entendi muy bien tu ejemplo. Me quedo tranquilo.
Gracias!!
__________________
I am Doyle please insert code.
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 08:34.