-
Posts
-
Hi, I am trying to clean up my homepage layer slider to play nicely on mobile. We want it to be full size for the height and width on a desktop, but when I put in the height in pixels in the layerslider I can’t figure out how to over ride it for phone size… is there a way to tell it to dynamically fill the screen? Thanks!
Hi janetgot;
I would imagine that you should use “”Media queries”./*Desktop Styles */
@media only screen and (min-width: 768px) {
/* Add your Desktop Styles here */}
/*Mobile Styles */
@media only screen and (max-width: 767px) {
/*Add your Mobile Styles here */}
Hey janetgot!
Did you have any luck solving your problem and did you try @begrafiks suggestions? If not, please let us know and we’ll give you some custom CSS to use.
Regards,
RikardHi Rikard, No haven’t figured it out yet…
Here is the code I am using for the home screen @media:
/* Smartphones (portrait and landscape) ———– */
@media only screen and (min-device-width : 320px) and (max-device-width : 480px) {.ls-wp-fullwidth-container, .ls-wp-fullwidth-helper {
height:280px !important;
}#after_layer_slider_1.main_color {
margin-top: 0px;
z-index: 999;
background: none;
}h2.ls-l {
width:45%;
top:2%;
left:10%;
font-size:13px !important;
}h4.ls-l {
top:15%;
left:18%;
font-size:12px !important;
}
}Thanks!
Hi!
I don’t think there is a way for it to “dynamically fill the screen”. You could try asking the LayerSlider developers.
You could keep doing it like how your currently using the media queries and then do something like this.
.avia-layerslider, .avia-layerslider * { height: 400px !important; }But it’s going to stretch and distort the images and probably not have the effect your wanting.
Cheers!
Elliott
- You must be logged in to reply to this topic.