Announcement

Collapse
No announcement yet.

Reduce the height of the input fields

Collapse
X
 
  • Filter
  • Time
  • Show
Clear All
new posts

    Reduce the height of the input fields

    how do I do to reduce the height of the input fields in Checkout Pages?
    Attach pic.
    Attached Files

    #2
    you could always use css...

    Comment


      #3
      Same way as you would outwith Actinic: Using CSS.


      input, textarea {

      font-size: 10px;
      height: 15px;
      line-height: 15px !important;

      }

      This includes a minor tweak for IE. What you will tend to find with input fields is the browser will generate a standard size, which the developers of the browser will have set for the best impact on user friendliness. As with all CSS which 'contradicts' the 'default settings' of a browser - you will most likely find large discrepancies between browsers and therefore - this is not advisable due to the severe nature of these fields. If a customer cannot see the fields, or cannot focus properly, they are likely to miss out fields, type incorrect data, or simply leave the site: Which is where they're headed if they fall into the first two outcomes.

      Comment


        #4
        Originally posted by gabrielcrowe View Post
        you could always use css...
        I have checked in css but found nothing about the address fields.
        here is the code for one of them

        <input type="text" name="INVOICEADDRESS1" size="40" maxlength="200" value="<Actinic:Variable Name="InvoiceAddress1"/>" />

        where should I write the code to reduce the height of the field?
        I have tested but nothing happend.

        Comment


          #5
          Originally posted by Ulf Nordbeck View Post
          I have checked in css but found nothing about the address fields.
          here is the code for one of them

          <input type="text" name="INVOICEADDRESS1" size="40" maxlength="200" value="<Actinic:Variable Name="InvoiceAddress1"/>" />

          where should I write the code to reduce the height of the field?
          I have tested but nothing happend.
          In your style sheet (Actinic.css or whatever you have it referenced as in the <head> of your web pages).

          In the line of code you posted, the 'size' is the physical length of the text field shown on your browser. The 'maxlength' is the maximum number of characters that will be submitted from the input field. CSS is the way forward (though again, I am still against your idea - reducing the size will only further decrease the user friendliness of your site)

          Comment


            #6
            Originally posted by grantglendinnin View Post
            In your style sheet (Actinic.css or whatever you have it referenced as in the <head> of your web pages).

            In the line of code you posted, the 'size' is the physical length of the text field shown on your browser. The 'maxlength' is the maximum number of characters that will be submitted from the input field. CSS is the way forward (though again, I am still against your idea - reducing the size will only further decrease the user friendliness of your site)
            This is only the address fields I want to reduce the height.
            I would like to have the code and it was to be placed.

            Comment


              #7
              ulf, the code has been given to you, and you have been told where to put it!

              to limit to only the address fields would require you to use a css class, and edit the templates accordingly. if this is too complicated, then perhaps you need to find a designer to do the required task.

              or learn some html

              Comment


                #8
                Originally posted by grantglendinnin View Post
                Same way as you would outwith Actinic: Using CSS.


                input, textarea {

                font-size: 10px;
                height: 15px;
                line-height: 15px !important;

                }

                This includes a minor tweak for IE. What you will tend to find with input fields is the browser will generate a standard size, which the developers of the browser will have set for the best impact on user friendliness. As with all CSS which 'contradicts' the 'default settings' of a browser - you will most likely find large discrepancies between browsers and therefore - this is not advisable due to the severe nature of these fields. If a customer cannot see the fields, or cannot focus properly, they are likely to miss out fields, type incorrect data, or simply leave the site: Which is where they're headed if they fall into the first two outcomes.
                I have tested css code.
                I see it affects the text area to the entire website.
                How can I make only affect the checkout Invoice Address fields?

                Comment


                  #9
                  Create a class and apply that class solely to the areas you want changed.

                  Comment

                  Working...
                  X