Adjunto una página de portfolio. Se han creado unos tabs para incorporar diferentes datos técnicos del producto y los colores que están colocados como imagen no logro que queden a columnas en el responsive de Mobile, me gustaria que se mostrara en 4 columnas igual que en desktop. Por otro lado, tambien me gustaria que las "pestañas" de cada tab se pueden mostrar más pequeñas en la versión mobile (adjunto captura) Me podriais ayudar? Muchas gracias.
Add this into the Custom CSS box in your Salient Theme Options panel (We write all Custom CSS in the Live Browser to ensure accuracy. If you cannot see any changes, make sure there is no red cross in the Custom CSS Box as any syntax error would cause all CSS under that line of code to not show up on the Frontend):
@media only screen and (min-width: 1px) and (max-width: 999px) {
.wpb_gallery_slidesimage_grid[data-onclick="link_image"] .portfolio-items[data-gutter="3px"]:not([data-col-num="elastic"]) .col.span_3 {
width: 50% !important;
}
}
Hola,
Adjunto una página de portfolio. Se han creado unos tabs para incorporar diferentes datos técnicos del producto y los colores que están colocados como imagen no logro que queden a columnas en el responsive de Mobile, me gustaria que se mostrara en 4 columnas igual que en desktop. Por otro lado, tambien me gustaria que las "pestañas" de cada tab se pueden mostrar más pequeñas en la versión mobile (adjunto captura) Me podriais ayudar? Muchas gracias.
Attached files: Captura de pantalla 2024-06-04 a las 19.37.32.png
Captura de pantalla 2024-06-04 a las 19.38.18.png
Captura de pantalla 2024-06-04 a las 19.39.30.png
Hey Again,
Add this into the Custom CSS box in your Salient Theme Options panel (We write all Custom CSS in the Live Browser to ensure accuracy. If you cannot see any changes, make sure there is no red cross in the Custom CSS Box as any syntax error would cause all CSS under that line of code to not show up on the Frontend):
@media only screen and (min-width: 1px) and (max-width: 999px) { .wpb_gallery_slidesimage_grid[data-onclick="link_image"] .portfolio-items[data-gutter="3px"]:not([data-col-num="elastic"]) .col.span_3 { width: 50% !important; } }Thanks
ThemeNectar Support Team
As for the Tabs:
@media only screen and (min-width: 1px) and (max-width: 999px) { .tabbed[data-style*="material"] .wpb_tabs_nav { display: flex; flex-wrap: wrap; } .tabbed[data-style*="material"] .wpb_tabs_nav li { width: 50% !important; } .tabbed[data-spacing=side-45px]:not([data-style=vertical]) .wpb_tabs_nav li .active-tab, .tabbed[data-spacing=side-45px]:not([data-style=vertical]) .wpb_tabs_nav li a { padding-left: 15px !important; padding-right: 15px !important; } }Thanks
ThemeNectar Support Team