The sample below is trying to keep a long string to overflow and stay within its div. I would expect height: auto; to increase the div height so the full string will wrap within the div rather than extend beyond the div (which is what the sample below
is doing).
Thanks if you can advise how to have the string wrap and stay within the div.
Member
248 Points
476 Posts
how to text wrap to keep long string within the div
Jul 27, 2016 01:28 PM|gunderj|LINK
The sample below is trying to keep a long string to overflow and stay within its div. I would expect height: auto; to increase the div height so the full string will wrap within the div rather than extend beyond the div (which is what the sample below is doing).
Thanks if you can advise how to have the string wrap and stay within the div.
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>@ViewBag.own Table Detail</title>
<style type="text/css">
*, html {
''font-family: Verdana, Arial, Helvetica, sans-serif;
margin: 0px;
padding: 0px;
}
body {
background-color: azure;
color: black;
}
#my_div {
float: left;
width: 15%;
height: auto;
text-wrap: normal;
overflow-wrap: break-word;
/*overflow: visible;*/
border: solid 1px blue;
}
</style>
</head>
<body>
<div id="my_div">
test_wrap_stay_within_the_div_by_increasing_the_height
</div>
</body>
</html>
All-Star
35218 Points
9955 Posts
Moderator
Re: how to text wrap to keep long string within the div
Jul 27, 2016 03:06 PM|bbcompent1|LINK
This post shows how to get your DIV to automatically wrap the text. Check out: http://forums.asp.net/post/4283227.aspx
All-Star
58254 Points
15681 Posts
Re: how to text wrap to keep long string within the div
Jul 27, 2016 04:00 PM|bruce (sqlwork.com)|LINK
your markup is correct for html 5 browsers. for which browser does it not work? if you are using IE, then may need to use the nonstandard word-wrap