-
bakedbycAsked on April 9, 2017 at 7:18 AM
Hi, my form i.
This images (the logo and the images of the sliders) size display differently on mobile browser, is there any way to make them mobile responsive?
Thank you!
-
JanReplied on April 9, 2017 at 9:49 AM
I checked your form and I can see that the slider images are responsive. Here's a screen capture:
However, the logo is too big in smaller screens. Please insert this custom CSS Code in order to fix the logo image:
@media only screen and (max-width: 40em) {
#cid_3 .form-image {
width: 176px !important;
height: 150px !important;
}}
Here's a guide on How-to-Inject-Custom-CSS-Codes. Here's the result:
Hope that helps. Thank you.
-
bakedbycReplied on April 9, 2017 at 10:04 AM
Hi Jan
Thanks for the prompt reply! The code works on the logo perfectly! However, the slider images are not displaying properly on my phone ( iphone 7 plus), here's a screenshot of how it display on my phone:
Many thanks!
-
MikeReplied on April 9, 2017 at 11:40 AM
You may try adding the next CSS to the form:
@media only screen and (max-width: 40em) {
.custom-field-frame,
.slidesjs-container,
.slidesjs-control {
width: 100% !important;
}
iframe#customFieldFrame_24 {
height: 349px !important;
}
}Result:
Thank you.