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
<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
[1096 byte] By [
karen987] at [2007-11-11 11:59:42]

# 1 Re: how to make text follow in a new line and fit into a cell without widening it
width="150px"
Amahdy at 2007-11-11 23:33:59 >

# 2 Re: how to make text follow in a new line and fit into a cell without widening it
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
<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
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"
<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 ] -->
# 3 Re: how to make text follow in a new line and fit into a cell without widening it
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.
Amahdy at 2007-11-11 23:36:05 >

# 4 Re: how to make text follow in a new line and fit into a cell without widening it
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.
<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,
.aColumn { height: 20px; width: 150px; overflow: hidden; }
# 5 Re: how to make text follow in a new line and fit into a cell without widening it
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>
Amahdy at 2007-11-11 23:38:04 >

# 6 Re: how to make text follow in a new line and fit into a cell without widening it
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:
.aColumn { word-wrap: break-word; width: 150px; overflow: hidden; }
code on the webpage is:
<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%>
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.
# 7 Re: how to make text follow in a new line and fit into a cell without widening it
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:
<td width="155" valign="top">
<!-- Left Column -->
<br /><A class="aColumn" target="_blank" href="ajskdhjkashdjaskdhjakshdjkashdjkahsdjkhsajkdhjskahdjksahdksahdjk">ajskdhjkashdjaskdhjakshdjkashdjkahsdjkhsajkdhjskahdjksahdksahdjk</A>
so what you have so far ?
Amahdy at 2007-11-11 23:40:13 >
