You are viewing limited content. For full access, please sign in.

Question

Question

Editing a File Upload Field

Forms
Updated April 18, 2017
asked on April 15, 2017

Hello everyone,

I am trying to edit a File Upload Field so that there is more space for the text and so that the button is at the right.

The original File Upload Field looks as follows:

I added the following code in CSS:

.fileuploader {float: right;}

Now the form looks like this:

Please advice on how I can make the text so that the text take a bit more space in this white region?

Regards,

-Guillaume

 

0 0

Replies

replied on April 17, 2017 • Show version history

Hello,

You might want to do something like,

.fileuploader label.cf-label {
  width: 75% !important;
}
.fileuploader .cf-field {
  width: 25% !important;
}

where the first part is for label width, the second part is for button width.

'.fileuploader' in front of both parts will make sure only fields with fileuploader class are affected.

 

0 0
replied on April 18, 2017

Hi Yoonsang,

Thank you for the reply, I tried the code but it doesn't work.

Please advise.

 

Regards,

-Guillaume

0 0
replied on April 18, 2017

Hello,

Can you please upload the screenshot of the 'CSS and Javascript' page of the form that you are working on? (with css section displayed)

Thank you

0 0
replied on April 18, 2017 • Show version history

Hello,

Does your file upload field have a css class name as 'fileuploader' under Advanced tab in Edit field dialog in Layout page? (Without 'fileuploader' class name those code won't work)

Plus, if that's not working for you, you can try with the following codes:

.fileuploader {
  float:right;
}
.fileuploader .cf-label {
  width: 70% !important;
}
.fileuploader .cf-field {
  width: 30% !important;
}

 Please let me know how this one goes.

Thank you.

0 0
You are not allowed to follow up in this post.

Sign in to reply to this post.

Details
Related Posts
Loading ...