pankaj.ghadge Posted November 5, 2008 Share Posted November 5, 2008 Hello,i have crated a div. In this div i don't want horizontal scroll bar. I want to display horizontal overflowed text on the next line ................If i hidden horizontal scroll then it is not showing me contain which gets overflowed.I want that contain to be shown on next line ...............Suppose i have entered "asssssssssssssssssssssssssssssssssssssssssssssdddddddddddddddddddddddddddddddddddddddaaaaaaa" (do not use the space ..)here is the code ......................please tell me <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html><head><style>.class-div{ overflow-y: auto; overflow-x: hidden;}</style><script type="text/javascript">function openDiv(){ var newDiv = document.createElement('div'), s = newDiv.style; newDiv.setAttribute('id',"divEntry"); newDiv.className="class-div"; s.border = '1px solid gray'; s.color = '#ccc'; s.width = '200px'; s.height = '200px'; s.backgroundColor = '#488be8'; s.top = '200px'; s.left = '200px'; s.position = 'fixed'; document.body.appendChild(newDiv); };function entervalue(evt){ var charCode = (evt.which) ? evt.which : window.event.keyCode; if(charCode==13) { document.getElementById("divEntry").innerHTML+=document.getElementById("txtEnter").value+"<br>"; document.getElementById("txtEnter").value=""; }}onload=openDiv;</script></head><body><!--<input type="button" value="click me to create Div in Right frame" onclick="return openDiv(100,100);">--><input type="text" id="txtEnter" onkeypress="entervalue(event)"> enter a value in this text box and press Enter</body></html> Link to comment Share on other sites More sharing options...
Ingolme Posted November 5, 2008 Share Posted November 5, 2008 CSS3 has the word-wrap property, but I don't know how many browsers currently have support for it.It would be used like this: word-wrap: break-word;Since I'm not sure if there's a lot of support for it, you can use PHP or Javascript to break the word at a certain point if it's too long. Link to comment Share on other sites More sharing options...
Synook Posted November 6, 2008 Share Posted November 6, 2008 element.innerHTML.replace(/([^\s]{100})([^\s])/ig, "$1- $2"); Link to comment Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.