Text display problem

how to display text in multiple lines

Page 1 of 1

2 Replies - 1309 Views - Last Post: 07 September 2009 - 09:53 PM

#1 javedparamount   User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 38
  • Joined: 28-July 09

Text display problem

Post icon  Posted 07 September 2009 - 08:43 PM

I have a list in "rightnav" div. i want when length of a list item increases then that item should b displayed in more then one line. but currently when i increase the text in a list item then text does not move on next line and extra text become unable to visible. fallowing is css coding

#rightnav
{
float: right;
width: 160px;
overflow:hidden;
margin: 0;
padding: 1em;
background-repeat:no-repeat;
height:inherit;
border-color:Maroon;
border-left-style:double;
}

ul
{
	margin-left:2px;
	margin-right:2px;
	text-align:center;
	   
}



The HTML Code

<div id="rightnav">
<img src="images/ncaa_avatar.jpg" />&nbsp;<br />
<marquee direction="up" scrolldelay="150"><ul>
<li>Hazro.............</li>
<li>Wah...............</li>
<li>Islamabad.........</li></ul></marquee>
	
	<img src="images/yahoo_avatar.gif" />
	</div>



Is This A Good Question/Topic? 0
  • +

Replies To: Text display problem

#2 Martyr2   User is offline

  • Programming Theoretician
  • member icon

Reputation: 5283
  • View blog
  • Posts: 14,104
  • Joined: 18-April 07

Re: Text display problem

Posted 07 September 2009 - 09:15 PM

Try using the word-wrap: break-word; css style on the menu container. This should then break your long words and wrap them to the next line but in all CSS 3.0 capable browsers.

Otherwise the normal word wrapping will only wrap to the next line IF the wording has spaces in it. The menu items you have there have no spaces in them, they are not going to wrap. If you put spaces in them, they should wrap to the next line as expected. :)
Was This Post Helpful? 0
  • +
  • -

#3 javedparamount   User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 38
  • Joined: 28-July 09

Re: Text display problem

Posted 07 September 2009 - 09:53 PM

View PostMartyr2, on 7 Sep, 2009 - 08:15 PM, said:

Try using the word-wrap: break-word; css style on the menu container. This should then break your long words and wrap them to the next line but in all CSS 3.0 capable browsers.

Otherwise the normal word wrapping will only wrap to the next line IF the wording has spaces in it. The menu items you have there have no spaces in them, they are not going to wrap. If you put spaces in them, they should wrap to the next line as expected. :)



Thank You !

My text will use white spaces but still not clear how to wrap. plz tell me about text-wrap.
Was This Post Helpful? 0
  • +
  • -

Page 1 of 1