How to set textarea with width of content?How do JavaScript closures work?How do I check if an element is hidden in jQuery?How do I remove a property from a JavaScript object?Set cellpadding and cellspacing in CSS?Setting “checked” for a checkbox with jQuery?How do I redirect to another webpage?How to disable text selection highlightingHow to check whether a string contains a substring in JavaScript?How to disable resizable property of textarea?How do I remove a particular element from an array in JavaScript?
Is TA-ing worth the opportunity cost?
Converting Piecewise function to C code
How do I calculate the difference in lens reach between a superzoom compact and a DSLR zoom lens?
How to use grep to search through the --help output?
Who are these characters/superheroes in the posters from Chris's room in Family Guy?
Reusing story title as chapter title
Improve survivability of bicycle container
Do other countries guarantee freedoms that the United States does not have?
Trying to create a folder with date and time with a space
Does the United States guarantee any unique freedoms?
Are there any differences in causality between linear and logistic regression?
Performance of a branch and bound algorithm VS branch-cut-heuristics
Look mom! I made my own (Base 10) numeral system!
Double blind peer review when paper cites author's GitHub repo for code
What word can be used to describe a bug in a movie?
Dereferencing a pointer in a 'for' loop initializer creates a segmentation fault
In Pokémon Go, why does one of my Pikachu have an option to evolve, but another one doesn't?
Author changing name
Blocking people from taking pictures of me with smartphone
Why are the inside diameters of some pipe larger than the stated size?
How to mark beverage cans in a cooler for a blind person?
Are there any financial disadvantages to living significantly "below your means"?
Are any jet engines used in combat aircraft water cooled?
Plausibility of Ice Eaters in the Arctic
How to set textarea with width of content?
How do JavaScript closures work?How do I check if an element is hidden in jQuery?How do I remove a property from a JavaScript object?Set cellpadding and cellspacing in CSS?Setting “checked” for a checkbox with jQuery?How do I redirect to another webpage?How to disable text selection highlightingHow to check whether a string contains a substring in JavaScript?How to disable resizable property of textarea?How do I remove a particular element from an array in JavaScript?
.everyoneloves__top-leaderboard:empty,.everyoneloves__mid-leaderboard:empty,.everyoneloves__bot-mid-leaderboard:empty margin-bottom:0;
I'm using react semantic ui textarea and I want to set width based on its content. min-width doesn't help. Any ideas?
<Textarea
key=idx
defaultValue=formattedText
className="customInput"
maxLength="100"
name=idx
onChange=e => this.handleChange(e)
/>
javascript css reactjs textarea semantic-ui
asked Mar 27 at 7:36
Yerlan YeszhanovYerlan Yeszhanov
1821 gold badge2 silver badges16 bronze badges
add a comment |
I'm using react semantic ui textarea and I want to set width based on its content. min-width doesn't help. Any ideas?
<Textarea
key=idx
defaultValue=formattedText
className="customInput"
maxLength="100"
name=idx
onChange=e => this.handleChange(e)
/>
javascript css reactjs textarea semantic-ui
asked Mar 27 at 7:36
Yerlan YeszhanovYerlan Yeszhanov
1821 gold badge2 silver badges16 bronze badges
I think you will need to write a function (onChange => Calculate width). Semantic Ui doesn't have any out-of-box solution for that.
– Ckappo
Mar 27 at 8:40
add a comment |
I'm using react semantic ui textarea and I want to set width based on its content. min-width doesn't help. Any ideas?
<Textarea
key=idx
defaultValue=formattedText
className="customInput"
maxLength="100"
name=idx
onChange=e => this.handleChange(e)
/>
javascript css reactjs textarea semantic-ui
asked Mar 27 at 7:36
Yerlan YeszhanovYerlan Yeszhanov
1821 gold badge2 silver badges16 bronze badges
I'm using react semantic ui textarea and I want to set width based on its content. min-width doesn't help. Any ideas?
<Textarea
key=idx
defaultValue=formattedText
className="customInput"
maxLength="100"
name=idx
onChange=e => this.handleChange(e)
/>
javascript css reactjs textarea semantic-ui
javascript css reactjs textarea semantic-ui
asked Mar 27 at 7:36
Yerlan YeszhanovYerlan Yeszhanov
1821 gold badge2 silver badges16 bronze badges
asked Mar 27 at 7:36
Yerlan YeszhanovYerlan Yeszhanov
1821 gold badge2 silver badges16 bronze badges
asked Mar 27 at 7:36
Yerlan YeszhanovYerlan Yeszhanov
1821 gold badge2 silver badges16 bronze badges
asked Mar 27 at 7:36
Yerlan YeszhanovYerlan Yeszhanov
1821 gold badge2 silver badges16 bronze badges
asked Mar 27 at 7:36
Yerlan YeszhanovYerlan Yeszhanov
1821 gold badge2 silver badges16 bronze badges
1821 gold badge2 silver badges16 bronze badges
I think you will need to write a function (onChange => Calculate width). Semantic Ui doesn't have any out-of-box solution for that.
– Ckappo
Mar 27 at 8:40
add a comment |
I think you will need to write a function (onChange => Calculate width). Semantic Ui doesn't have any out-of-box solution for that.
– Ckappo
Mar 27 at 8:40
I think you will need to write a function (onChange => Calculate width). Semantic Ui doesn't have any out-of-box solution for that.
– Ckappo
Mar 27 at 8:40
I think you will need to write a function (onChange => Calculate width). Semantic Ui doesn't have any out-of-box solution for that.
– Ckappo
Mar 27 at 8:40
add a comment |
1 Answer
1
active
oldest
votes
You can bind style attr in vue like below
<Textarea :style="widthContent"/>
export default
computed:
widthContent()
//caculate your width here
return width: ...px
More details:
https://vuejs.org/v2/guide/class-and-style.html
answered Mar 27 at 7:45
DeadToyDeadToy
12 bronze badges
add a comment |
Your Answer
StackExchange.ifUsing("editor", function ()
StackExchange.using("externalEditor", function ()
StackExchange.using("snippets", function ()
StackExchange.snippets.init();
);
);
, "code-snippets");
StackExchange.ready(function()
var channelOptions =
tags: "".split(" "),
id: "1"
;
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function()
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled)
StackExchange.using("snippets", function()
createEditor();
);
else
createEditor();
);
function createEditor()
StackExchange.prepareEditor(
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader:
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
,
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
);
);
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f55371981%2fhow-to-set-textarea-with-width-of-content%23new-answer', 'question_page');
);
Post as a guest
Required, but never shown
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
You can bind style attr in vue like below
<Textarea :style="widthContent"/>
export default
computed:
widthContent()
//caculate your width here
return width: ...px
More details:
https://vuejs.org/v2/guide/class-and-style.html
answered Mar 27 at 7:45
DeadToyDeadToy
12 bronze badges
add a comment |
You can bind style attr in vue like below
<Textarea :style="widthContent"/>
export default
computed:
widthContent()
//caculate your width here
return width: ...px
More details:
https://vuejs.org/v2/guide/class-and-style.html
answered Mar 27 at 7:45
DeadToyDeadToy
12 bronze badges
add a comment |
You can bind style attr in vue like below
<Textarea :style="widthContent"/>
export default
computed:
widthContent()
//caculate your width here
return width: ...px
More details:
https://vuejs.org/v2/guide/class-and-style.html
answered Mar 27 at 7:45
DeadToyDeadToy
12 bronze badges
You can bind style attr in vue like below
<Textarea :style="widthContent"/>
export default
computed:
widthContent()
//caculate your width here
return width: ...px
More details:
https://vuejs.org/v2/guide/class-and-style.html
answered Mar 27 at 7:45
DeadToyDeadToy
12 bronze badges
answered Mar 27 at 7:45
DeadToyDeadToy
12 bronze badges
answered Mar 27 at 7:45
DeadToyDeadToy
12 bronze badges
answered Mar 27 at 7:45
DeadToyDeadToy
12 bronze badges
12 bronze badges
add a comment |
add a comment |
Got a question that you can’t ask on public Stack Overflow? Learn more about sharing private information with Stack Overflow for Teams.
Got a question that you can’t ask on public Stack Overflow? Learn more about sharing private information with Stack Overflow for Teams.
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f55371981%2fhow-to-set-textarea-with-width-of-content%23new-answer', 'question_page');
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
I think you will need to write a function (onChange => Calculate width). Semantic Ui doesn't have any out-of-box solution for that.
– Ckappo
Mar 27 at 8:40