Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
    Posts
  • March 5, 2015 at 1:59 pm #406392
    sitesme

    Hi,
    We would like to have 2 fields for a form + 1 button all in a single line like this: http://d.pr/i/1dUo6/40UuONln
    This is how the visual editor on WP shows, but when we go to the website the result is http://d.pr/i/13V9Y/2PHTxrSK
    How can we make it all in 1 line?

    March 5, 2015 at 5:55 pm #406551
    Günter

    Hi sitesme!

    Thank you for using our theme.

    You can use the standard contact form (ALB or shortcode) and adjust the column width for each element.

    Did you try that?

    Cheers!
    Günter

    March 7, 2015 at 9:37 pm #407565
    sitesme

    Hi Gunter,

    I have no idea on how to do that.
    Could you please give me the ready-code based on my code below?

    March 7, 2015 at 9:39 pm #407566
    sitesme
    This reply has been marked as private.
    March 9, 2015 at 9:49 am #407924
    sitesme

    Hi,
    Is there an update for this please?
    Thank you

    March 9, 2015 at 4:58 pm #408250
    Yigit

    Hey!

    Please add following code to Quick CSS in Enfold theme options under General Styling tab

    @media only screen and (min-width: 769px) {
.page-id-25 input[type="text"], .page-id-25 select {
  width: 44%!important;
  float: left;
}
.page-id-25 select {
  margin-left: 2%!important;
  margin-right: 2%!important;
}}

    Best regards,
    Yigit

    March 10, 2015 at 11:09 am #408726
    sitesme

    Thank you Yigit,
    However, it is still not 100%: http://d.pr/i/5yzG/2r6CFMWO

    The .ae drop-down should also be very small compared with the text field.
    The domain label is not aligned any more and the button Go should be in the same line as the other two.

    Any other idea?
    Many thanks.

    March 10, 2015 at 11:35 am #408734
    Günter

    Hi!

    Thank you for coming back.

    There is a problem with the label. If you remove it, you can try the following and adjust the values of width:

    
.page-id-25 input[type="text"] {
    float: left !important;
    width: 73% !important;
}

.page-id-25 select {
    float: left !important;
    width: 10% !important;
}

.page-id-25 select {
    margin-left: 5px !important;
    margin-right: 5px !important;
}

    The label has no tag, so there is no chance to adjust its position with CSS and it breaks everything.

    Best regards,
    Günter

    March 10, 2015 at 11:43 am #408740
    sitesme

    Thank you Gunter,
    It is getting better now. I had to remove the label as it wouldn’t be adjusted properly.
    Is there a way to have the form centered and not aligned to the left?
    Thank you

    March 10, 2015 at 11:51 am #408744
    Günter

    Hey!

    Not really. The form container is 100% width, and the elements are not placed in a container, that can be centered.

    Youi can try the following to have a look that is closely centered (adjust the value):

    
.page-id-25 input[type="text"] {
    margin-left: 15% !important;
}

    Cheers!
    Günter

  • Author
    Posts
Viewing 10 posts - 1 through 10 (of 10 total)
  • You must be logged in to reply to this topic.