I want to resize my text inside pre element like textarea, for example if you set columns of textarea equal to 10 and your text exceeds that, then the text will go to next line.
How can I do that with pre element? What is the technical term?
Note that I need to use pre element because it reads \n and \r, and textarea does not allow to append a button under it (why?).
An example:
I present a dummy scenario below (working code) to illustrate my issue(s).
Thnamks. Thanks.
<!DOCTYPE html>
<html>
<head>
<button onclick="call()">Click</button>
</body>
<script>
function call(){
view = window.open("","Viewer", "width=400,height=600, resizable=no");
view.document.write('<div id="id_1"</div>');
t=["asdf", "sasdfasdfasdfasdfasd", "sasdfasdfasdfasdfasd"]
id = view.document.getElementById("id_1");
for (var i = 0; i < 3; i++){
if (i % 2 == 0){
ed_1 = document.createElement("pre");
ed_1.id = "edt_"+i;
ed_1.textContent = t[i];
id.appendChild(ed_1);
prnt = view.document.getElementById("edt_"+i);
edb_1 = document.createElement("button");
nextline_gap_1 = document.createElement("br");
edb_1.innerHTML = "Button no = "+i;
edb_1.id = i;
prnt.appendChild(nextline_gap_1);
prnt.appendChild(edb_1);
}
else{
text_a = document.createElement("textarea");
text_a.readOnly = "true";
text_a.cols = "10";
text_a.id = "edt_"+i;
text_a.textContent = t[i];
id.appendChild(text_a);
prnt = view.document.getElementById("edt_"+i);
edb_1 = document.createElement("button");
nextline_gap_1 = document.createElement("br");
edb_1.innerHTML = "Button no = "+i;
edb_1.id = i;
prnt.appendChild(nextline_gap_1);
prnt.appendChild(edb_1);
} } }
</script>
</html>
from Resize text inside
element like
No comments:
Post a Comment