Foros del Web » Creando para Internet » CSS »

[SOLUCIONADO] Problemita con un @media

Estas en el tema de Problemita con un @media en el foro de CSS en Foros del Web. Buenas gente, tengo un problema relativamente sencillo pero las "soluciones" que traté de usar como que no funcionaron. En teoría lo que estoy haciendo es ...
  #1 (permalink)  
Antiguo 02/06/2013, 18:57
Avatar de nanotime  
Fecha de Ingreso: noviembre-2011
Ubicación: Cd. Guayana
Mensajes: 145
Antigüedad: 12 años, 8 meses
Puntos: 6
Problemita con un @media

Buenas gente, tengo un problema relativamente sencillo pero las "soluciones" que traté de usar como que no funcionaron.

En teoría lo que estoy haciendo es un media simple que cambia la disposición de un solo elemento a inline y le quita las posiciones absolutas y lo pondría centrado arriba, debajo de un div que contiene una imágen, absolutamente nada más.

El estilo del media es este(en scss):

Código CSS:
Ver original
  1. #sidebar-nav{
  2.     display: inline-block;
  3.     margin: 0 auto;
  4.     li{
  5.         list-style-type: none;
  6.         display: inline-block;
  7.     }
  8.     i{
  9.         color: $white;
  10.     }
  11. }

Este es el código del estilo normal:

Código CSS:
Ver original
  1. #sidebar-nav{
  2.     position: absolute;
  3.     right: 0px;
  4.     top: 50%;
  5.     li{
  6.         list-style-type: none;
  7.     }
  8.     i{
  9.         color: $white;
  10.         @include transition-property(color);
  11.         @include transition-duration(0.7s);
  12.         @include transition-timing-function(ease-in);
  13.  
  14.         &:hover{
  15.             color: $link-color;
  16.         }
  17.     }
  18. }

El html (traducido de twig) sería este:

Código HTML:
Ver original
  1.     <div class="row">
  2.         <div class="small-12 colums">
  3.             <a href="/ukernel/"></a>
  4.     </div>
  5.     <div id="sidebar-nav">
  6.         <ul>
  7.             <li></li>
  8.             <li></li>
  9.             <li></li>
  10.         </ul>
  11.     </div>

Justo despues de ese div es que vienen todos los demás elementos, pero en teoría esto debería posicionar el div en ese lugar no? Igual les dejo unas imágenes:



Así es normal, como lo quiero

y...



Así es en teoría como quiero que quede, en esa disposición, pero no en ese lugar sino justo debajo del "bug" rojo de arriba...

¿Qué estaría haciendo mal entonces? D: Gracias de antemano
  #2 (permalink)  
Antiguo 02/06/2013, 19:21
Avatar de pzin
Moderata 😈
 
Fecha de Ingreso: julio-2002
Ubicación: Islas Canarias
Mensajes: 10.489
Antigüedad: 22 años
Puntos: 2114
Respuesta: Problemita con un @media

No queda muy claro cómo estás empleando los media-queries.

De todas formas, con los media-queries las reglas no se reinicializan, sino que se amplían. Es como si declaras la misma clase varias veces, todo lo que declares a menos que lo sobreescribas se aplicará. Por ejemplo, sino cambias la posición a estática seguirá siendo absoluta.

No es buena cosa publicar código SCSS en vez de CSS. Hay gente que no lo usa e igual no lo entiende.
  #3 (permalink)  
Antiguo 02/06/2013, 20:20
Avatar de nanotime  
Fecha de Ingreso: noviembre-2011
Ubicación: Cd. Guayana
Mensajes: 145
Antigüedad: 12 años, 8 meses
Puntos: 6
Respuesta: Problemita con un @media

Ah perfecto, tengo que probar y sí, es cierto, tengo que usar el css solo que está minificado y es complicado trabajarlo y buscarlo aunque lo "desminifique"

Etiquetas: color, hover, html, media, problemita
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 05:22.