Adjust Text Area Size

[Gabe Belknap]

Hi folks,

I continue to build a Confluence form using Confiforms, and I am now having issues adjusting the size of the Text Area box. I am trying to use width:1000px, but it is not working. 

I have tried a comment box, with the same result.

Does anyone know if you can force the width of a Text Area or Comment box?

Thanks

[Alex Medved _ConfiForms_]

https://www.w3.org/TR/1998/REC-CSS2-19980512/#:~:text=Abstract,HTML%20documents%20and%20XML%20applications).

[Srinath S]

Hi Alex,

I am unable to make the read only field word wrap whatever I try :( Please let me know where/how I should find the css spec?

[Alex Medved _ConfiForms_]

Try setting min-width attribute as well. There is plenty of options that you can do with CSS - I suggest to have a look at CSS spec to see what is possible

[Srinath S]

Hi Alex,

I have a readonly field where that basically pre-loads data from another form's textarea field with more than 2-3 lines.

The problem I am facing is the texts are going beyond the visible area of the read only field hence I tried to use css to customize the field size so that the users dont need to scroll to read the words beyond the visible area, using below but the words are still not getting word wrapped and the users have to basically scroll:

height:150px; width:200px !important; max-width:200px !important; word-wrap: break-word !important

Please help me :(

[Alex Medved _ConfiForms_]

Hi

If you look at the CSS defined by Atlassian then you will see that there is also a 

max-width

attribute defined.

So, you need to set both (width and max-width), when you want to override the width of a field.

Alex

[Gabe Belknap]

Hey Davin,

Unfortunately, !important; did not may any difference.  Perhaps I am SOL?

Thanks

[Davin Studer]

You may need to do it this way.

width: 1000px !important;

There are some other styles in the AUI framework that might be getting in the way. Specifically these ...

form.aui .aui-select2-container .select2-choices, form.aui .multi-select, form.aui .password, form.aui .select, form.aui .text, form.aui .textarea {
    border: 1px solid #c1c7d0;
    border-radius: 3.01px;
    box-sizing: border-box;
    font-size: inherit;
    margin: 0;
    max-width: 250px;
    vertical-align: baseline;
    width: 100%;
}

.large-field {
    max-width: 380px !important;
    min-width: 250px;
    width: 250px !important;
}