CSS Overflow auto

Question

Hi i doing comment box in my webpage so that i am doing a validation of that comment box by not allowing the user to enter the empty comment, and a comment sholud not be greater than 255 characters it all working fine but when i enter the comment like this means

aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaakjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjj

this string is overflowing out of the comment box div i.e it is going like a straight line I had used css property overflow: auto; but wat i need is it should be shown like this. it should split the string

aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaakjjjjjjjjj
jjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjj
jjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjj

for ex: when i comment like this The p element has both line boxes and a child box for the q element, which is a block-level element. The line boxes before the q are wrapped in an anonymous block-level box and so are the line boxes after the q. The resulting tree of boxes might be as fol

it coming up proper ... it should like this

possible duplicate of CSS: how can I force a long string (without any blank) to be wrapped in XUL and/or HTML — Gabriele Petrioli
– Gabriele Petrioli, Commented Apr 13, 2011 at 9:37

kapa · Accepted Answer · 2011-04-13 09:35:18Z

9

What you need is CSS word-wrap: break-word;. It is widely supported among browsers.

word-wrap on CSS3.info

word-wrap: break-word

answered Apr 13, 2011 at 9:35

kapa

78.9k21 gold badges166 silver badges178 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Liam Spencer Over a year ago

Won't word-wrap cause some problems with older browsers, being a CSS3 feature?

kapa Over a year ago

It was standardized in CSS3, though it has existed for a long time. caniuse.com/#search=word-wrap

Liam Spencer Over a year ago

Thanks for that. Ignore my answer, this is probably your best option. :)

Igor Popov · Accepted Answer · 2011-04-13 09:37:19Z

2

You can use CSS3 property to solve your question:

.text_wrap {
  word-wrap: break-word;
}

answered Apr 13, 2011 at 9:37

Igor Popov

9988 silver badges16 bronze badges

3 Comments

kapa Over a year ago

How is this different from my earlier answer? :)

Igor Popov Over a year ago

I just started type my answer before you answer was published and published my answer after you :)

kapa Over a year ago

Happens a lot to me either :).

Collectives™ on Stack Overflow

CSS Overflow auto

2 Answers 2

3 Comments

3 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

3 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related