Phone field styling

  • Profile Image
    Asked on October 07, 2014 at 03:59 AM

    Hi, I'm getting some unusal styling on the Phone Field, where the seperate areas are overlapping

    Could you advise on some correct CSS to fix this please.


  • Profile Image
    Answered on October 07, 2014 at 08:43 AM

    This was caused by the width property you have added to the form-textbox class selector.

    Try to add these CSS codes to your form's style:

    #input_6_area {
    width50px !important;
    #input_6_phone {
    width100px !important;



    Feel free to adjust the numbers to suit your preference.


  • Profile Image
    Answered on October 07, 2014 at 08:49 AM

    @NeilVicente perfect.  Thank you for your help.  That fixed the problem.

  • Profile Image
    Answered on October 07, 2014 at 10:21 AM


    Glad to hear that the solution provided by my colleague, NeilVicente, worked.

    If you need help or further assistance, feel free to open a new thread here in the forum.