-
Posts
-
Hello,
I have a form on each of my pages that looks too large when I look at it on phones. Is there any way to resize it for mobile? I’ve attached my website link in the ‘only visible for moderator section’.
Thanks!Hey Cynthia45,
Can you provide a screenshot of how you view it on your phone?
Best regards,
Jordan ShannonOK
Here’s the screen capture.
https://snag.gy/0fyOFW.jpgHi,
Thank you. So are you just looking to shrink the button and make the fields full width?
Best regards,
Jordan ShannonHi Jordan,
I’d like it to look more like this.
https://snag.gy/AFjrJX.jpgI’d also love it if there was a way to make my image different? or Shrink? on mobile so the text could be read easier (like on the 2nd screenshot I sent)
Hi,
Add this to quick css:
@media (max-width: 667px) and (min-width: 320px){ #_form_13_ ._inline-style{ float:left!important; display:inline!important; width:50%!important; } ._button-wrapper._inline-style #_form_13_submit{ width:100%!important; padding-bottom:20px!important; }}Best regards,
Jordan ShannonThanks Jordan.
That put the name and email side by side but everything else is the same. The button is to the left and not full width and it’s overlapping the text below.
I’ve also decided to add an image, which I can’t seem to get to fit in properly. I’ve picked 80×80 as a size but it’s a little too small. Is it possible to do 100×100? (it’s not in the options to choose from)
I’d like it to fit within the blue bar on desktop and to be on the left in mobile. I’ve added screenshots for both.https://snag.gy/aeoCjn.jpg
https://snag.gy/aFj2Wp.jpgThanks!
Hi Cynthia45,
This code is making the button to to be 50%.
#_form_13_ ._inline-style{ float:left!important; display:inline!important; width:50%!important; }This code needs to be removed
And this code added
#_form_13_ ._button-wrapper._inline-style { width: 100%!important; }If you need further assistance please let us know.
Best regards,
VictoriaThanks Victoria.
With the image, I’ve selected the 80×80 size because that’s the smallest to choose from. But it’s a little too small.
Is there a way to make it a little bigger so that it’s not cut off?Hi,
Try this code in the General Styling > Quick CSS field:#top.home #av_section_1 .avia-builder-el-2 .avia_image { height: 100px !important; }Best regards,
MikeHi Mike,
I added that to the quick css and the image didn’t change.
Is there something else I need to tweak?I cleared my cache and it looks like the image you sent.
It’s still cut off though so maybe it needs to be larger? I’d like it to be able to show the whole image and center it within the blue space.
Is that possible?
Thanks!
- You must be logged in to reply to this topic.