<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Text Wrapping Example</title>
<style>
/* Container styling */
.wrapper {
width: 300px; /* Fixed width to demonstrate wrapping */
border: 2px solid #333; /* Border for visibility */
padding: 10px;
font-family: Arial, sans-serif;
/* Enable wrapping for long words */
word-wrap: break-word; /* Older property */
overflow-wrap: break-word; /* Modern property */
white-space: normal; /* Allow normal wrapping */
}
</style>
</head>
<body>
<h2>Text Wrapping Demo</h2>
<div class="wrapper">
This text will wrap automatically when it reaches the edge of the container.
</div>
<br>
<div class="wrapper">
ThisIsATextWithoutSpacesThatWillBreakAndWrapToTheNextLineUsingCSS.
</div>
</body>
</html>
<!--
run:
This text will wrap automatically when it
reaches the edge of the container.
ThisIsATextWithoutSpacesThatWillBreakA
ndWrapToTheNextLineUsingCSS.
-->
