0

Don't know how to explain this. Let's see the picture enter image description here

enter image description here

See! Some text is showing divided. I used overflow hidden property. I've cut off the whole string into 200 letters. And then positioned it inside a div. This is dynamic. Problem occurs when someone put extra
or newlines in the paragraph. Then this happens. Can anyone please tell me how to stop this? These half sentences should not occur in that div as visible. Is there any system or property to stop this?

AtanuCSE
  • 8,832
  • 14
  • 74
  • 112

3 Answers3

0

First of all you need to remove any fixed height for the divs, probably replacing it for a min-height.

Second, you should set the property overflow:none, to avoid rendering to cut the contents of the div, and instead of that expand it to the required size.

opalenzuela
  • 3,139
  • 21
  • 41
  • Can't do that. This div has to be in fixed length.Otherwise design will be broken. – AtanuCSE Nov 15 '13 at 07:26
  • Then the only option you have is to hide the text, but you will lose contents. Try with text-overflow property (or making a responsive design web) – opalenzuela Nov 15 '13 at 07:29
0

use white-space: nowrap; for your div to show the text in one line.this way, it'll hide the extra text that comes in your div of fixed width as you have hidden the overflow

check this for ref :
http://css-tricks.com/almanac/properties/w/whitespace/
https://developer.mozilla.org/en-US/docs/Web/CSS/white-space
http://www.w3schools.com/cssref/pr_text_white-space.asp

NoobEditor
  • 15,563
  • 19
  • 81
  • 112
0

you can even try overflow: scroll. By this no matter how much content you have, u can always scroll.

Ajey
  • 7,924
  • 12
  • 62
  • 86