Home / Questions / How to Wrap text in Html
Explanatory Question

How to Wrap text in Html

👁 255 Views
📘 Detailed Answer
🕒 Easy to Read
Read the answer carefully and go through the related questions on the right side to improve your understanding of this topic.

Answer with Explanation

If we want to wrap the text in Html, then we have to follow the steps which are given below. Using these steps, any user can easily wrap any text, which is to be shown on the web page.

Step 1: Firstly, we have to type the Html code in any text editor or open the existing Html file in the text editor in which we want to wrap the text.


<!Doctype Html>  
<Html>     
<Head>      
<Title>     
Wrap the text  
</Title>  
</Head>  
<Body>   
 Hello User   
 Your are at atnyla.  
If we want to wrap the text in Html, then we have to follow the steps which are given on this page.   
</Body>   
</Html>

Step 2: Now, we have to use word-wrap property. So, we have to place the cursor between the head tag just after the title tag. And, then we have to define a class and 

tag sector in the 

Step 3: Now, we have to define that class before the text, which we want to wrap.


<div class="a">Any text which we want to wrap </div>

Step 4: And, at last, we have to save the file and run the file in the browser.


<!Doctype Html>  
<Html>     
<Head>      
<Title>     
Wrap the text  
</Title>  
<style>  
div {  
  width: 100px;   
  border: 2px solid blue;  
}  
div.a {  
  word-wrap: normal;  
}  
div.b {  
  word-wrap: break-word;  
}  
</style>  
</Head>  
<Body>   
 Hello User   
 <div class="a">Your are at atnyla. If we want to wrap the text in Html then we have to follow the steps which are given in this page. </div> <br>  
   <div class="b">Your are at atnyla. If we want to wrap the text in Html then we have to follow the steps which are given in this page. </div>  
</Body>   
</Html>

Preview

If you will run above code, you will get below output.