wordBreak Property - Javascript CSS Style Property

Javascript examples for CSS Style Property:wordBreak

  1. HOME
  2. Javascript
  3. CSS Style Property
  4. wordBreak

Description

The wordBreak property sets and gets line breaking rules for non-CJK scripts.

Property Values

Value Description
normalDefault value. Break words according to their usual rules
break-all Lines may break between any two letters
keep-all? Breaks are not between pairs of letters
initial Sets this property to its default value.
inherit Inherits this property from its parent element.

Technical Details

Item Value
Default Value: normal
Return Value: A String, representing the word-break property of an element
CSS VersionCSS3

Break words between any two letters:

Demo Code

ResultView the demo in separate window 

<!DOCTYPE html>
<html>
<head>
<style>
#myDIV {// w  w  w . j av  a  2 s  .c  o  m
    width: 150px;
    height: 100px;
    background-color: lightblue;
    border: 1px solid black;
}
</style>
</head>
<body>

<div id="myDIV">Thisword1thisthisthisthisthisthis23123123123</div>

<button onclick="myFunction()">Test</button>

<script>
function myFunction() {
    document.getElementById("myDIV").style.wordBreak = "break-all";
}
</script>

</body>
</html>

Related Tutorials