I’ve redesigned my website to have a couple of fullscreen sliders to act as section headers, but when I look at them on a iphone or ipad the images appear to be zoomed into the top corners and cannot see exactly what is happening!
Can anyone help how to sort this out?
Website address is http://www.martinwardphotography.com
Ive used the code below that I found on another thread, now using a fullwidth easy slider, the photos show on my iphone, but not on my ipad???
Any ideas why it’ll show on one and not the other?
@media only screen and (min-width: 768px) {
.slider-desktop {
display:block !important;
}
.slider-phone {
display:none !important;
}
}
@media only screen and (min-width: 768px) {
.slider-desktop {
display:block !important;
}
.slider-phone {
display:none !important;
}
}
@media only screen and (max-width: 767px) {
.slider-desktop {
display:none !important;
}
.slider-phone {
display:block !important;
}
}
Hi,
Please try this instead:
@media only screen and (min-width: 1025px) {
.slider-desktop {
display:block !important;
}
.slider-phone {
display:none !important;
}
}
@media only screen and (min-width: 1025px) {
.slider-desktop {
display:block !important;
}
.slider-phone {
display:none !important;
}
}
@media only screen and (max-width: 1024px) {
.slider-desktop {
display:none !important;
}
.slider-phone {
display:block !important;
}
}
Best regards,
Rikard
Awesome stuff, that worked and site is now displaying on everything the way that I want it to!
This thread can be closed off now!!