[SOLUCIONADO] Problemita con un @media

nanotime · #1 (**permalink**) 02/06/2013, 18:57

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#sidebar-nav{
    display: inline-block;
    margin: 0 auto;
    li{
        list-style-type: none;
        display: inline-block;
    }
    i{
        color: $white;
    }
}

Este es el código del estilo normal:

Código CSS:

Ver original#sidebar-nav{
    position: absolute;
    right: 0px;
    top: 50%;
    li{
        list-style-type: none;
    }
    i{
        color: $white;
        @include transition-property(color);
        @include transition-duration(0.7s);
        @include transition-timing-function(ease-in);
 
        &:hover{
            color: $link-color;
        }
    }
}

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

Código HTML:

Ver original<body>
    <div class="row">
        <div class="small-12 colums">
            <a href="/ukernel/"> … </a>
    </div>
    <div id="sidebar-nav">
        <ul>
            <li> … </li>
            <li> … </li>
            <li> … </li>
        </ul>
    </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

pzin · #2 (**permalink**) 02/06/2013, 19:21

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.

nanotime · #3 (**permalink**) 02/06/2013, 20:20

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"