Tip of the day – WordWrap style property

18 Mar

Hi folks,

Here is the todays tip of the day.

Scenario : Specifies or returns whether the statement or a line should break if it exceeds. 

There are two ways to handle this scenario.

1. Using CSS
2. Javascript

Using CSS – Sample 1

border:1px solid #000000;

<p> This paragraph contains a very long word: thisisaveryveryveryveryveryverylongword. The long word will break and wrap to the next line.</p>

Sample Code :

Using CSS – Sample 2

<div style=”word-wrap: break-word;”>
<br />
<div style=”word-wrap: normal;”>

Using Javascript :

#myDiv {
word-wrap: normal;
width: 200px;
height: 150px;
background: #99C6CD;
<script type=”text/javascript”>
function ChangeWordSpacing (value) {
var div = document.getElementById (“myDiv”);
if (‘wordWrap’ in { = value;
} else {
alert (“Your browser doesn’t support this example!”);
<div id=”myDiv”>
<br />
<button onclick=”ChangeWordSpacing (‘break-word’);”>break-word</button>
<button onclick=”ChangeWordSpacing (‘normal’);”>normal</button>

Happy Learning!!.

Get glued to know more updates.

Have a nice day 🙂

Leave a comment

Posted by on March 18, 2013 in Uncategorized


Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: