Buenos días,
Tengo el Atlas theme de worpress instalado y con una galeria de marcas creadas en la siguente url: http://creativaonline.cat/provaweb/?page_id=11
El problema es que en modo responsive me gustaria que salieran cada imagen en una sola columna como adjunto en la capyura de pantalla...y no en 4 columnas como sale ahora mismo....
Alguna ayuda?
Muchas gracias
URL del sitio: Contenido solo visible a usuarios registrados
Hola Jordi.
Edita el archivo atlas_wp-custom.css que encontraras en wp-content -> themes -> atlas_wp -> css -> atlas_wp-custom.css y añade lo siguiente:
@media (max-width: 780px) { #gallery-1 .gallery-item { float:none!important; width:100%!important; } }
Un saludo
Ya lo he puesto y no funciona:
/**
* @version $Id: grid-responsive.css 2375 2012-08-14 22:41:53Z kevin $
* @author RocketTheme http://www.rockettheme.com
* @copyright Copyright (C) 2007 - 2014 RocketTheme, LLC
* @license http://www.rockettheme.com/legal/license.php RocketTheme Proprietary Use License
* Descripción : Sobreescritura de los estilos de 1200px para que sea por defecto 960px;
*
*/
#rt-transition .rt-container {width: 960px;margin: 0 auto;position: relative;}
#rt-transition .rt-grid-1 {width: 80px;}
#rt-transition .rt-grid-2 {width: 160px;}
#rt-transition .rt-grid-3 {width: 240px;}
#rt-transition .rt-grid-4 {width: 320px;}
#rt-transition .rt-grid-5 {width: 400px;}
#rt-transition .rt-grid-6 {width: 480px;}
#rt-transition .rt-grid-7 {width: 560px;}
#rt-transition .rt-grid-8 {width: 640px;}
#rt-transition .rt-grid-9 {width: 720px;}
#rt-transition .rt-grid-10 {width: 800px;}
#rt-transition .rt-grid-11 {width: 880px;}
#rt-transition .rt-grid-12 {width: 960px;}
@media only screen and (min-width: 768px) and (max-width: 959px) {
#rt-transition .rt-container {width: 768px;}
#rt-transition .rt-grid-1 {width: 64px;}
#rt-transition .rt-grid-2 {width: 128px;}
#rt-transition .rt-grid-3 {width: 192px;}
#rt-transition .rt-grid-4 {width: 256px;}
#rt-transition .rt-grid-5 {width: 320px;}
#rt-transition .rt-grid-6 {width: 384px;}
#rt-transition .rt-grid-7 {width: 448px;}
#rt-transition .rt-grid-8 {width: 512px;}
#rt-transition .rt-grid-9 {width: 576px;}
#rt-transition .rt-grid-10 {width: 640px;}
#rt-transition .rt-grid-11 {width: 704px;}
#rt-transition .rt-grid-12 {width: 768px;}
#gallery-1 .gallery-item {
float:none!important;
width:100%!important;
}
}
@media only screen and (min-width: 481px) and (max-width: 767px) {
body {-webkit-tap-highlight-color: transparent;}
#rt-transition .rt-container {width: 480px;}
#rt-transition .rt-container [class*="rt-grid"] {display: block;float: none;position: relative;width: 100%;}
#rt-transition .rt-container [class*="rt-push"], [class*="rt-pull"] {left: auto;}
#rt-transition .rt-container [class*="rt-prefix"] {padding-left: 0;}
#gallery-1 .gallery-item {
float:none!important;
width:100%!important;
}
}
@media only screen and (max-width: 480px) {
body {-webkit-tap-highlight-color: transparent;}
#rt-transition .rt-container {width: 95%;}
#rt-transition .rt-container [class*="rt-grid"] {display: block;float: none;position: relative;width: 100%;}
#rt-transition .rt-container [class*="rt-push"], [class*="rt-pull"] {left: auto;}
#rt-transition .rt-container [class*="rt-prefix"] {padding-left: 0;}
#gallery-1 .gallery-item {
float:none!important;
width:100%!important;
}
}
Ya esta....era gallery-2
Muchas gracias