4 hours ago, Pack_12 said:Por cierto, que pasaría si quiero también ocultar otro bloque definido en ese módulo? Por ejemplo. Hay un bloque que en modo mobile no quiero que aparezca tampoco porque se queda demasiado sobrecargada la pagina de producto. Se trata del bloque 5, que en la product page aparece a la derecha. He probado a añadir codigo similar pero no funciona. Que me recomiendas en este caso?
@media(max-width:480px) {
div#iqithtmlandbanners-block-2.d-inline-block {
display: none!important;
}
}@media(max-width:480px) {
div#iqithtmlandbanners-block-5.d-inline-block {
display: none!important;
}
}El segundo lo ignora. 😓
El segundo lo ignora porque el bloque 5 no tiene la clase "d-inline-block". Los selectores para las reglas CSS pueden ser los IDs de los elementos o las clases (entre otros). En el caso del ejemplo que yo te puse iba así:
div#iqithtmlandbanners-block-7.d-inline-block, que en realidad es:
elemento#id-elemento.clase-elemento
Los IDs van precedidos de una almohadilla (#), y las clases de un punto. Si todo se refiere al mismo elemento, va todo junto sin espacio. Si se refiere a elementos que están DENTRO de otros irían separados por espacios.
Bien, en el caso del bloque 5 que comentas, en el código de la página viene definido así:
<div id="iqithtmlandbanners-block-5" class="col col-md block block-toggle block-iqithtmlandbanners-html js-block-toggle">
Tiene un ID y varias clases (se puede utilizar cualquiera de ellas o varias). Por lo que si se quiere crear una regla CSS que se aplique solo a ese elemento, podría ser así:
div#iqithtmlandbanners-block-5.iqithtmlandbanners-html {
También se pueden meter varias reglas dentro de un mismo bloque @media, y también se pueden poner varios selectores para la misma regla, separándolos por comas por lo que simplificando todo, en tu caso podría ser:
@media(max-width:480px) { div#iqithtmlandbanners-block-2.d-inline-block, div#iqithtmlandbanners-block-7.d-inline-block, div#iqithtmlandbanners-block-5.block-iqithtmlandbanners-html { display: none!important; } }
Una única regla dentro de un media y que se aplica a tres elementos diferentes (los tres selectores que van separados por comas). El poner cada cosa en una línea diferente es sólo por claridad al leerlo, al navegador le da igual si lo pones así o todo seguido sin saltos de línea.