Word Wrap Text In Div.
Pages: 1, 2
free web hosting

Read Latest Entries..: (Post #16) by iGuest on Sep 2 2008, 12:57 PM. (Line Breaks Removed)
text should be fixed inside div Word Wrap Text In Div. I need the text to be fit inside the div.Ie if I'm giving a long text the div should not expand and the words should fit inside and when I'm taking the mouse over the full text should be visible-reply by ruby
Read the FIRST post of this Topic. - Express your Opinion! Contribute Knowledge :-).

Open Discussion > CONTRIBUTE > Computers > Programming Languages > HTML, XML etc..

Word Wrap Text In Div.

kvarnerexpress
Sep 13 2005, 07:47 PM
i use 2 div's for the page layout. One for navigation and one for the contents.

html Code:

Original - html Code:

CODE
   <div width="10%" style="position: absolute; left: 2%;"> bbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb </div> <div width="86%" style="position: absolute; left: 14%;"> bbbb </div>


But now the b's wont stay within their div-element. I want lines that doesnt fit on one line within the divto wrap to the next line.

How can i do this?
Thanks,kvarnerexpress


Reply

Saint_Michael
Sep 13 2005, 08:03 PM
CODE

<div style="position:absolute; top:20; left:20; width:300; height:300;></div>[/div]


you have to use the top in your div position in order to seperate it work with this set up and you will solve your issue.


Notice from dundun2007:
Edited as requested

Reply

Lozbo
Sep 14 2005, 12:30 AM
I didnt actually understand what you were asking, but i think i can see what your trouble is, as you put so many 'b's together, the div is expanding itself to fit its content, but it would be different with normal words (words with less than 10 characters or whatever).

So i think that what st mike said wont do, i dont know if theres anyway to css that, like "white-space: nowrap", but upside down this property, becouse what i understood is that you want the text to actually WRAP.

Reply

Saint_Michael
Sep 14 2005, 01:28 AM
no kvan is asking how to septerate the 2 tables if you notice the b's that are group together that look like doubles, thats what he is referring to.

Reply

snlildude87
Sep 14 2005, 01:35 AM
No, Michael. Lozbo is right. I've had this trouble when coding templates. If you use a really long word, then I suggest just using the wordwrap function in PHP to break it down. Like Lozbo said, if you're typing normally, then your word should wrap, and you will be fine. Long words are what usually break layout anyway, and there is really no way to fix this (I may be wrong, so you CSS gurus correct me if I am).

Reply

Saint_Michael
Sep 14 2005, 02:11 AM
ok then if that is the case then all you would have to do is sperate the text using a <br> or <p> tag then, cuz i just now tried different settings with width and height and i got nothing.

but with css that geared more towards tables then <div> tags, but if you put the <div> tag within the table then it should word wrap with in the table its self.

Reply

Tyssen
Sep 14 2005, 05:18 AM
QUOTE(Saint_Michael @ Sep 14 2005, 12:11 PM)
but with css that geared more towards tables then <div> tags, but if you put the <div> tag within the table then it should word wrap with in the table its self.

CSS geared towards tables? Where'd you get that from? blink.gif
And if you're using CSS, why would you enclose your div within a table?
Even if you were using tables, if a word is too long, like snlildude87 says, it's gonna stretch the width of the table cell regardless of whether you've set a width or not.

Reply

Lozbo
Sep 14 2005, 05:22 AM
QUOTE(snlildude87 @ Sep 13 2005, 07:35 PM)
If you use a really long word, then I suggest just using the wordwrap function in PHP to break it down.
*


How's that wordwrap function from php?

So i have also been trying to hack that out but didnot know how to do it.

Michael i think that <br /> or <p> wont do what kvar seeks, becouse that would make the layout always break, not when the browser resizes.

Reply

littleweseth
Sep 16 2005, 06:24 AM
If you don't mind using a scrollbar, you can apply the following style :
CODE

#longlines {
clip : auto;
overflow : scroll;
}


Anything that doesn't fit will automagically make it's parent box scrollable. Of course, if this is your content box, this will be a sonna sam for your users (scroll to bottom of page, move across, move back up, go back down, go across....), but if you're only enclosing small samples it should be fine.

Reply

Lozbo
Sep 17 2005, 07:22 PM
hey little weseth, about this issue of making its parent box scrollable, i havent been able to make a td scrollable, i think i heard it was not possible, is it? only thing i can figure out to get pass this is by adding a div inside the cell, but i dont know if theres anyother way...

Reply

Latest Entries

iGuest
Sep 2 2008, 12:57 PM
text should be fixed inside div
Word Wrap Text In Div.

I need the text to be fit inside the div.Ie if I'm giving a long text the div should not expand and the words should fit inside and when I'm taking the mouse over the full text should be visible

-reply by ruby

Reply

iGuest
Feb 22 2008, 06:00 AM
how wrap the text content inside the div tag?
Word Wrap Text In Div.

Sir
I developed a site for company.The contents are displayed dynamically. With the help of Ajax.Here the contet are from Databse and placed inside "div tag".
Which are inside the "table". The content stored in the DB is in html format.
So the problem is SOME TIMES IF THE CONTENT'S(table ) WIDTH IS GREATER THAN THE SPECIFIED SIZE OF THE table(USER SIDE) THEN THE ALIGNMENT FULLY CHANGED.

THE CONTENT FROM THE DTATABASE COULD NOT OCCUPY THE SPECIFIED SPACE IN DISPLAY SIDE(user side). THE CONTENT COULD NOT WRAP and CANT PACED INSIDE THE TABLE.
Please help me how to wrap the content inside the table.

<td width="600" height="400px" bgcolor="#FFFFFF" colspan="2" >
<div id="txtHint" style="width:595; vertical-align:top ;" >
//CONTENT FROM DB
//AJAX TECHNOLOGY USED, the content paced in <div>
</div></td>

Plese help me
Saami

Reply

iGuest
Jan 21 2008, 06:10 PM
Use overflow
Word Wrap Text In Div.

Replying to Tyssen

There is a style attribute 'overflow' which you can use to accomplish this. There are 3 values of this attribute viz. Auto, scroll and hidden. If you want only scroll to be present horizontally, you can use overflow-x, or overflow-y as per your case. Read this for further information (http://msdn2.Microsoft.Com/en-us/library/ms534312(VS.85).Aspx)

-reply by Gaurav

Reply

iGuest
Oct 18 2007, 08:45 PM
Try using <span></span> around your text

-FooSoup

Reply

Tyssen
Oct 4 2005, 02:46 AM
QUOTE(Re_Atum @ Oct 4 2005, 09:36 AM)
CODE
  <div width="10%" style="position: absolute; left: 2%; word-wrap:break-word;"> bbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb </div> <div width="86%" style="position: absolute; left: 14%;word-wrap:break-word;"> bbbb </div>


That only works in IE/WIN and Safari 1.3+.

Reply


Got an Opinion! Express your Views! (no registration):-
Add your Reply/ Opinion/ Views/ Comments/ Suggestion/ Questions/ Queries etc.
Posts with decent grammar & English will be accepted and please refrain from profanities.
For asking a Question, We recommend you to sign-up (for free) so that you can track the topic easily.

Nature of your Post*: Opinion/ Reply/ Comments
Question/Query
Feedback to us.
       
Name   Email
Title/Question*

(Maximum characters: 10,000)
You have characters left.

Pages: 1, 2
Recent Queries:-
  1. div text flow - 1.82 hr back. (1)
  2. text wrapping div html - 1.90 hr back. (1)
  3. warp text inside div - 4.85 hr back. (1)
  4. wrap content in a div html - 5.91 hr back. (1)
  5. css div not word wrap - 7.34 hr back. (1)
  6. text wrapping inside a div tag - 7.37 hr back. (1)
  7. div wrap width - 7.71 hr back. (2)
  8. wrap text without spaces in div - 8.06 hr back. (1)
  9. wrap the content in div bottom direction - 8.83 hr back. (1)
  10. div word wrap - 16.28 hr back. (1)
  11. wrap on divs - 16.97 hr back. (1)
  12. word wrap in div - 17.41 hr back. (1)
  13. div wordwrap - 18.01 hr back. (1)
  14. text wrap in div - 18.14 hr back. (1)
Similar Topics

Keywords : word, wrap, text, div

  1. Any Advice From Experts?
    wrapping text around pictures. (3)
  2. Centered Div Layout Issues
    Float Right item not vertically aligned with text (2)
    Hey everyone. I am writing an all div layout for my friends website and i just cant seem to get all
    the fields aligned properly. I can get all my images to be aligned and look great until i put any
    text on the site. For example, my box that will contain links and such has 3 parts: top, middle and
    bottom. Each of these have 3 parts: left, middle and right. To program the 3 parts of each row, i
    use 3 divs which are all floated based on their position. However, as soon as I put text in the
    middle area, the right image is moved down to a new line. The sample site is located ....
  3. Text Problem
    (6)
    Alright well I am having a slight problem with my coding. I made my template and have it up on my
    site but my text I placed in the content box is towards the middle. I would like it at the top but
    I forget how to do that. I know it has to do with some like putting a table inside the table and
    making the height 100% or something. If someone could help me out with the coding I would greatly
    appreciate it. The link to my site is Here and the code used for the content box is this...
    CODE   <td colspan="6" rowspan="3"background="images/cont....
  4. Select All Text In A Form Field On Click
    (1)
    Hi, I have made a script which generates a BBcode when you run it, and displays it in a text field,
    like this: CODE <input type="text" name="bbcode" size="81"
    value="[IMG]<?php echo $url; ?>[/IMG]"> Well, anyway, I
    want something that selects all the text in that form field when you click on it, like it does in
    ImageShack when you upload.......
  5. Glow Text
    need help (2)
    Hi i Have One Vbulletin Form and i want Glow Users Name in form How can i do this I search in
    JavaScripts but i can not find it If You find it tell me thanks then Where Past this code on my form
    thanks /blink.gif' border='0' style='vertical-align:middle' alt='blink.gif' /> ....
  6. Add Text In Input-field
    (5)
    this is a picture of my shoutbox: one problem: the links/code for adding one of the smilies to
    the message-input-field (text: e.g. /laugh.gif' border='0' style='vertical-align:middle'
    alt='laugh.gif' /> , /unsure.gif' border='0' style='vertical-align:middle' alt='unsure.gif' />
    ,...) are missing. Does someone knows how this can be fixed? -the name of the message-input-field
    is "message". thanks in advance! /cool.gif' border='0' style='vertical-align:middle'
    alt='cool.gif' /> ....
  7. Layers With Text Appear
    (1)
    When I view this page in a Firefox browser on a Windows operating system, it looks fine, but when I
    view it on a friend's Firefox browser on his Linux operating system, the text layers extend
    their height downward on the page and overlaps the graphics on the bottom of the page. Is there a
    known fix?....


      8. Looking for word, wrap, text, div

*RANDOM STUFF*





*SIMILAR VIDEOS*
Searching Video's for word, wrap, text, div
Watch the latest videos on YouTube.com

*MORE FROM TRAP17.COM*
advertisement



Word Wrap Text In Div.



 

 

 

 

ADD REPLY / Got an Opinion! a humble request :-) RAPID SEARCH! Free Hosting [X]
Express your Opinions, Thoughts or Contribute your information that might help someone here.
Ask your Doubts & Queries to get answers.. "Together, We enlight each other!" 		Register FREE for AD-FREE forum, Create your own topics, Ask Questions, track topics, setup subscriptions & notifications and Get a Free Website w/ Email and FTP.
500MB Space *No Ads*, CPanel, FTP, PHP, MySQL, EMails - 100% FREE