Viewing 11 posts - 1 through 11 (of 11 total)
  • Author
    Posts
  • December 14, 2016 at 6:48 pm #724439
    aliakbari2

    Hi,

    I am in the process of developing a website and in one of the pages I have created a more advanced contact form however when I view the form on a mobile device parts of the “text fields” have been cut off. I have attached a picture to show what the problem is.

    I would like to know if there is a fix for this.

    Responsive Issue

    Many thanks for your hard work!

    December 14, 2016 at 6:55 pm #724444
    Yigit

    Hey!

    Please try adding this code to the Quick CSS section under Enfold > General Styling or to your child themes style.css file:

    @media only screen and (max-width: 325px) {
.responsive .avia_ajax_form .form_element {
    width: 95%;
}}

    Best regards,
    Yigit

    December 14, 2016 at 7:06 pm #724451
    aliakbari2

    Hi, thanks for the response, unfortunately that did not resolve the issue, I cleared the cache but no effect.

    December 14, 2016 at 7:07 pm #724452
    Yigit

    Hey!

    Please try changing the code to following one 

    @media only screen and (max-width: 380px) {
.responsive .avia_ajax_form .form_element {
    width: 95% !important;
}}

    Cheers!
    Yigit

    December 14, 2016 at 7:47 pm #724478
    aliakbari2

    Hi, I’ve replaced the top code with the bottom one however the contact form is still not fully showing. I’ve tried clearing the cache but that has no effect.

    December 14, 2016 at 7:53 pm #724484
    Yigit

    Hi!

    Please create a temporary admin login and post it here privately so we can look into it.

    Best regards,
    Yigit

    December 14, 2016 at 8:20 pm #724502
    aliakbari2

    The information has been posted, thank you again :)

    December 15, 2016 at 10:11 pm #725036
    aliakbari2

    Hi, I would like to know if you have any updates about the fix. Thank you.

    December 15, 2016 at 11:20 pm #725074
    Yigit

    Hi!

    i changed the code to following one

    @media only screen and (max-width: 380px) {
#top .avia_ajax_form .text_input, #top .avia_ajax_form .select, #top .avia_ajax_form .text_area {
    width: 80% !important;
}}
@media only screen and (max-width: 280px) {
#top .avia_ajax_form .text_input, #top .avia_ajax_form .select, #top .avia_ajax_form .text_area {
    width: 65% !important;
}}

    Please flush browser cache and review your website

    Best regards,
    Yigit

    December 16, 2016 at 6:47 pm #725518
    aliakbari2

    You are amazing, thank you so much for helping me out :)
    Great service!

    December 16, 2016 at 9:07 pm #725538
    Yigit

    Hi!

    You are welcome! :)

    For your information, you can take a look at Enfold documentation here – http://kriesi.at/documentation/enfold/
    And if there are features that you wish Enfold had, you can request them and vote the requested ones here – https://kriesi.at/support/enfold-feature-requests/
    For any other questions or issues, feel free to post them here on the forum and we will gladly try to help you :)

    Enjoy your weekend!

    Regards,
    Yigit

  • Author
    Posts
Viewing 11 posts - 1 through 11 (of 11 total)
  • The topic ‘Enfold Responsive Issue with the Contact Form’ is closed to new replies.