how to make text follow in a new line and fit into a cell without widening it


DevX Home    Today's Headlines   Articles Archive   Tip Bank   Forums   

Results 1 to 8 of 8

Thread: how to make text follow in a new line and fit into a cell without widening it

  1. #1
    Join Date
    Apr 2007
    Posts
    42

    how to make text follow in a new line and fit into a cell without widening it

    I have a column in a table, which draws out info from a database. The column is 150px wide. I want it to remain this wide, even if one word is longer. What happens now is that if i put in a web address which is long, it makes the columner wider. I want to make it trunucate the url so that it ends after 150px has been reached and continues to the next line. If i have a word longer than 150px i will have the same problem.

    Any solutions anyone? what do i need to add to make the code in the <a class....> fit into 150px and then continue to the next line if the word is longer?

    Here is the relevant part of the code

    Code:
    <td width="150" valign="top">
    					
    <!-- Left Column -->
    				 
    <a class="RelatedArticle" href="view.asp?ID=<%=trim(RS("ID"))%>"><%=trim(RS("fldTITLE"))%></a><br />					
    									</td>
    does anyone know what i need to add to the code or the table? i'm not html literate, and i use dreameaver 8 for designing, i only know the very basics.

    thanks in advance

  2. #2
    Join Date
    Oct 2005
    Location
    Maady
    Posts
    1,819
    width="150px"
    Programmer&Cracker CS
    MyBlog:Blog.Amahdy.com
    MyWebsite:www.Amahdy.com

  3. #3
    Join Date
    Apr 2007
    Posts
    42
    Quote Originally Posted by Amahdy
    width="150px"
    are you saying that it was a missing px that is causing the problem? nothing more?

    i doubt this is the cause, anyway i tried using a style like this

    Code:
    <td class="aTitle" valign="top"> 			
    <!-- Left Column -->
    <a class="RelatedArticle" href="view.asp?ID=<%=trim(RS("ID"))%>"><%=trim(RS("fldTITLE"))%></a><br /></td>
    and on the css styles page i added

    Code:
    td.acolumn { 
    width: 150px; 
    overflow: hidden;
    }

    The actual data that needs trunucating is a url that is very long. it is drawn from the part of the code which contains the authors biodate and webaddress and email.
    Here is more of the code in case it may be the problem, in not letting it work. the table 658 is split into 3 columns, the first column is 150px and the data comes after the "authors image" but before the "related article" links, which means it must be the part that begins "if DB to use =1"



    Code:
    <table width="658" align="center" cellpadding="2" cellspacing="0" border="0">
    <tr>
    
    <td class="aTitle" valign="top"> 
    					<!-- Left Column -->
    						
    												
    <%IF NOT (NIMAGE = "" OR IsNUll(NIMAGE)) THEN%>			<img src="<%=NIMAGE%>" width="60" height="50" vspace="8" border="1"/> <br />
    <hr align="center" width="100%" size="1" style="color: gray;"/>
    <%END IF%>
    <img src="images1/related2.JPG" width="140" height="36" alt="" border="0" /><br />
    <br />
    <%						
    
    IF DB_TO_USE = 1 OR DB_TO_USE = 3 THEN
    							
    SQL = "SELECT ID, fldTITLE FROM nm_tbl_news WHERE ((fldACTIVE = 1) AND (Now() BETWEEN fldPOSTED AND fldEXPIRES)) AND (ID IN (SELECT fldCID FROM nm_tbl_relations WHERE fldPID = " & NID & "))"
    						
    ELSE
    							
    SQL = "SELECT ID, fldTITLE FROM nm_tbl_news WHERE ((fldACTIVE = 1) AND (GetDate() BETWEEN fldPOSTED AND fldEXPIRES)) AND (ID IN (SELECT fldCID FROM nm_tbl_relations WHERE fldPID = " & NID & "))"
    						
    END IF    		
    Set RS = Server.CreateObject("ADODB.Recordset")
    RS.LockType   = 1
    RS.CursorType = 0
    RS.Open SQL, MyConn	
    WHILE NOT RS.EOF 
    							
    RCOUNT = RCOUNT + 1
    %>
    
    <img src="images1/blackbullet.JPG" width="5" height="5" alt="" border="0" /> <a class="RelatedArticle" href="view.asp?ID=<%=trim(RS("ID"))%>"><%=trim(RS("fldTITLE"))%></a><br />
    <%							RS.MoveNext
    						
    WEND
    						
    RS.Close 
    						
    Set RS = Nothing IF RCOUNT = 0 THEN%>There are no related articles.<% End If %>			
    						<br /><br />
    						
    						
    <!-- [ Left Column ] -->

  4. #4
    Join Date
    Oct 2005
    Location
    Maady
    Posts
    1,819
    sometimes missing "px" is the problem, it was the only error I can see in the previous post but for this post the error is :

    class="aTitle"

    should be:

    class="acolumn"

    hope this helps.
    Programmer&Cracker CS
    MyBlog:Blog.Amahdy.com
    MyWebsite:www.Amahdy.com

  5. #5
    Join Date
    Apr 2007
    Posts
    42
    Quote Originally Posted by Amahdy
    sometimes missing "px" is the problem, it was the only error I can see in the previous post but for this post the error is :

    class="aTitle"

    should be:

    class="acolumn"

    hope this helps.
    yes i realised, thank you.


    sorry still no results that work,

    i actually discovered the right code, that needs modifying, i didn't post it above, it was the wrong code.
    Here is what i have at the present, and using your suggestionms, which doesn't chop the url, it still makes the table cell longer. Bear in mind the url that is pulled is like one very long word, it's a headache, what a silly problem

    ive even tried adding the style from dreamweaver, to the "email" and "web address" part, but it still wouldn't chop the url and make it fit into 2 lines instead of extending the table cell.


    Code:
    <td width="190" valign="top">
    <!-- Left Column -->
    						
    
    <%IF NOT (BIO = "" OR IsNUll(BIO) OR IMAGE = "" OR IsNUll(IMAGE)) THEN%>						
    <div style="padding-right: 5px;padding-bottom: 5px;">
    							
    <img src="<%=IMAGE%>" width="60" height="50" vspace="4" border="1" align="left"/> 
    <%=BIO%><br />
    							
    <%IF NOT (WEB = "" OR IsNull(WEB)) THEN%><br /><A class="aColumn" target="_blank" href="<%=WEB%>"><%=WEB%></A>
    <%END IF%>				
    <%IF NOT (EMAIL = "" OR IsNull(EMAIL)) THEN%><br />
    
    <A class="aColumn" href="mailto:<%=EMAIL%>"><%=EMAIL%></A><%END IF%><hr align="center" width="100%" size="1" style="color: gray;"/>


    and in my stylessheet i have added,

    Code:
    .aColumn { height: 20px; width: 150px; overflow: hidden; }

  6. #6
    Join Date
    Oct 2005
    Location
    Maady
    Posts
    1,819

    Arrow

    does your URL look like this :

    <a href="LONG_URL">LONG_URL</a>

    ??

    a url generally does not contains spaces - special symbols - or new lines ... so the HTML parser doesn't know where to cut off the line ... like any auto-fit operation . thus you may need to split it manualy after a number of character and display the results between <br>'s ...
    or i suggest using some thing like this :
    <a href="LONG_URL">CLICK HERE FOR MORE INFO ABOUT YOU !!!</a>
    Last edited by Amahdy; 11-10-2007 at 02:04 PM.
    Programmer&Cracker CS
    MyBlog:Blog.Amahdy.com
    MyWebsite:www.Amahdy.com

  7. #7
    Join Date
    Apr 2007
    Posts
    42
    OK now it works, i have managed to get the code below to chop the url, but what happens is that the url gets chopped, and the chopped bit, doesn't carry on in the next line. It works in the link though, but i'd like the whole link (url) to show, it can carry on the next line and line after if need be.

    This is what im using, but on the page itself, the part which is [end/code] or something, shows on the webpage. I also note that the code works even if i don't add the vbscript part, so is it necessasry? Anyway this is the page code now

    In the stylesheet:

    Code:
    [code language="VBScript"]
    
    .aColumn { word-wrap: break-word; width: 150px; overflow: hidden; }
    code on the webpage is:

    Code:
    <table width="760" align="center" cellpadding="2" cellspacing="0" border="0">
    </p>
    <tr>
    <td width="155" valign="top">
    <!-- Left Column -->
    
    
    <%IF NOT (BIO = "" OR IsNUll(BIO) OR IMAGE = "" OR IsNUll(IMAGE)) THEN%> 
    <div style="padding-right: 5px;padding-bottom: 5px;">
    <img src="<%=IMAGE%>" width="60" height="50" vspace="4" border="1" align="left"/> 
    <%=BIO%><br />
    
    <%IF NOT (WEB = "" OR IsNull(WEB)) THEN%><br /><A class="aColumn" target="_blank" href="<%=WEB%>"><%=WEB%></A>
    <%END IF%> 
    <%IF NOT (EMAIL = "" OR IsNull(EMAIL)) THEN%><br /><A class="aColumn" href="mailto:<%=EMAIL%>"><%=EMAIL%></A><%END IF%>
    [/CODE]

    do i leave the cell table as it is? the only problem now is that the last bit ( [/code]) shows on the webpagge, and that the chopped url doesn't show on the next line. It fits though, the cell doesn't widen now.

  8. #8
    Join Date
    Oct 2005
    Location
    Maady
    Posts
    1,819
    I don't understand the problem exactly so I'll give you some notes and hope they can help:
    -<style>YOUR STYLE HERE</style>
    I don't know what's there ...

    -<script language="vbscript">
    and I don't know if the mentioned [ code ... ] [ / code] works ...
    I think <% %> is enough

    here is some code that works for me:
    Code:
    <td width="155" valign="top">
    <!-- Left Column -->
    <br /><A class="aColumn" target="_blank" href="ajskdhjkashdjaskdhjakshdjkashdjkahsdjkhsajkdhjskahdjksahdksahdjk">ajskdhjkashdjaskdhjakshdjkashdjkahsdjkhsajkdhjskahdjksahdksahdjk</A>
    so what you have so far ?
    Programmer&Cracker CS
    MyBlog:Blog.Amahdy.com
    MyWebsite:www.Amahdy.com

Similar Threads

  1. Justify text in table cell
    By Brian in forum Web
    Replies: 1
    Last Post: 10-12-2000, 04:14 AM

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center
 
 
FAQ
Latest Articles
Java
.NET
XML
Database
Enterprise
Questions? Contact us.
C++
Web Development
Wireless
Latest Tips
Open Source


   Development Centers

   -- Android Development Center
   -- Cloud Development Project Center
   -- HTML5 Development Center
   -- Windows Mobile Development Center