|
This trans.gif is a keyed 1-pixel GIF file. Stretching this image makes IE and other browsers act as if it was true content (in fact, images are content, like text). The fine thing is that if the image width and height are indicated, then IE and other browsers don't even have to figure out the actual content rect.
The keyed thing is to allow the GIF to be hidden (it doesn't even obscure the page background color).
This technique is used in many many websites.
She's so dirty, she threw a boomerang and it wouldn't even come back.
|
|
|
|
|
__Stephane Rodriguez__ wrote:
This trans.gif is a keyed 1-pixel GIF file. Stretching this image makes IE and other browsers act as if it was true content (in fact, images are content, like text). The fine thing is that if the image width and height are indicated, then IE and other browsers don't even have to figure out the actual content rect.
Thanx Stephane, I see that it works, but now IE uses the content to set the width of the TD. It seems that if TD width > content width (TD width=200) then it messes up ALL following TD width's. This is wrong behaviour. Why can ONE one tables TD's width affect the outer tables TD's width?
So what do I do if I need to put text inside and not just "blanks"?
This from the HTML 3.2 spec:
The minimum and maximum width of nested tables contribute to the minimum and maximum width of the cell in which they occur. Once the width requirements are known for the top level table, the column widths for that table can be assigned. This allows the widths of nested tables to be assigned and hence in turn the column widths of such tables. If practical, all columns should be assigned at least their minimum widths. It is suggested that any surplus space is then shared out proportional to the difference between the minimum and maximum width requirements of each column.
This confirms that any nested table has no effect on the outer table. So if the nested table's width is fixed then it affects the outer table's column, but if the nested table's width is 100% then it should fill the outer table's TD, to whatever size that maybe.
I have another idea that I am going to try with the transparent gif.
CHeers 
Before you criticize a man, walk a mile in his shoes. That way, when you do criticize him, you'll be a mile away and have his shoes.
|
|
|
|
|
leppie wrote:
So what do I do if I need to put text inside and not just "blanks"?
Usually web designers insert a fake row (1-pixel height) made of all the td columns with only stretched transp images as content. This sets the widths of all columns.
Then all "data" rows follow.
Same stuff for solving the height problem. It gets tricky when you try to solve pixel-perfectness for both width and height at the same time. That's why most web pages are in fact properly handled in the horizontal direction only.
She's so dirty, she threw a boomerang and it wouldn't even come back.
|
|
|
|
|
So I tried this, and it still does not render like it should!  Maybe its time for the suicide note 
If you look at this, the 3rd row becomes "variable". That is quite inconsistant. Now if we look at row 3 , we can see that:
Now we know the row width is 100%, then we 3 TD's namely 2 with width 15px, so we end up according to the spec with 100% - (2 x 15px) = nested table's width. But it does not work that way in IE.
Cheers
Before you criticize a man, walk a mile in his shoes. That way, when you do criticize him, you'll be a mile away and have his shoes.
|
|
|
|
|
leppie wrote:
<tr><td width=15><img src="transp.gif" width=15 height=1></td><td width=15>
<img src="transp.gif" width=15 height=1></td><td colspan=1></td></tr></i>
If at least one of the TD width is not indicated, and the overall table width is not indicated (or indicated as %), then at least one of the column becomes "variable". In addition, the positioning of the actual columns depends on the browser, browser version, and so on.
To remove "variable"-size columns, you must indicate the width for all columns, and the table width. All in absolute pixels, not in %.
She's so dirty, she threw a boomerang and it wouldn't even come back.
|
|
|
|
|
<small><b>__Stephane Rodriguez__ wrote:</b></small>
<i>To remove "variable"-size columns, you must indicate the width for all columns, and the table width. All in absolute pixels, not in %.</i>
But I WANT that last column's width variable! Then I will place some more content in that variable width column.
<small><b>__Stephane Rodriguez__ wrote:</b></small>
<i>If at least one of the TD width is not indicated, and the overall table width is not indicated (or indicated as %), then at least one of the column becomes "variable". In addition, the positioning of the actual columns depends on the browser, browser version, and so on.</i>
That is correct, with one exception. All column's width's that has not been specified, will be divided among equally to take up the rest on the table's width.
So if we have a table with say 4 columns and 2 of thems with has been defined ( case one: 15px, case 2: 15% ) and the tables width is defined as 100%. Say the allowable width of the table is 100px, according to the browser.
Case 1:
The width of the 2 remaining columns = 35px each. (100 - (2 x 15))/2
Case 2:
The width of the 2 remaining columns = 35px each. (100 - (2 x 15))/2/100 x 100
Now we resize the browser to make table's width to 200px.
Case 1:
The width of the 2 remaining columns = 85px each. (200 - (2 x 15))/2
Case 2:
The width of the 2 remaining columns = 70px each. (100 - (2 x 15))/2/100 x 200
Now with this knowledge we implement the original problem (with the 1st TD of the nested table = 150px. Say the browser's calculated table width is 500px.
The TD's width of row one must be: 500px.
The last TD's width of row 2 must be: 485px. 500 - 15.
The last TD's width of row 3 must be: 470px. 500 - 15 - 15.
Now again we resize the browser. Table width now is 700px.
The TD's width of row one must be: 700px.
The last TD's width of row 2 must be: 685px. 700 - 15.
The last TD's width of row 3 must be: 670px. 700 - 15 - 15.
Now , the nested table's column's width could only affect the outer table if it was bigger than the outer table's column's width, which is <b>not</b> the case! Now paste the following and you will see what I mean. I added some CSS to illustrate the point. You will see table 2 & 4 does not render correctly. Try some more combinations, and things get more inconsistant.
Cheers
<HTML>
<HEAD>
<TITLE></TITLE>
<style type="text/css">
<!--
.OuterColumn {
background-color: #66FF00;
border: 1px solid #FF6633;
}
.NestedTable {
background-color: #FFCC99;
border: 1px solid #0033FF;
}
-->
</style>
</HEAD>
<body>
<table cellpadding="0" cellspacing="0" width=100%>
<tr>
<td colspan="3" class="OuterColumn"><table width="100%" border="1" class="NestedTable">
<tr>
<td>variable</td>
<td width="150">150</td>
</tr>
</table>
</td>
</tr>
<tr>
<td width="30" class="OuterColumn">30</td>
<td colspan="2" class="OuterColumn"><table width="100%" border="1" class="NestedTable">
<tr>
<td>variable</td>
<td width=100>100</td>
</tr>
</table>
</td>
</tr>
<tr>
<td width="30" class="OuterColumn">30</td>
<td width="30" class="OuterColumn">30</td>
<td class="OuterColumn"><table width="100%" border="1" class="NestedTable">
<tr>
<td>variable</td>
<td width=100>100</td>
</tr>
</table></td>
</tr>
<tr>
<td width="30" class="OuterColumn">30</td>
<td colspan="2" class="OuterColumn"><table width="100%" border="1" class="NestedTable">
<tr>
<td>variable</td>
<td width=100>100</td>
</tr>
</table>
</td>
</tr>
</table>
<table cellpadding="0" cellspacing="0" width=100%>
<tr>
<td colspan="3" class="OuterColumn"><table width="100%" border="1" class="NestedTable">
<tr>
<td>variable</td>
<td width="100">100</td>
</tr>
</table></td>
</tr>
<tr>
<td width="30" class="OuterColumn">30</td>
<td colspan="2" class="OuterColumn"><table width="100%" border="1" class="NestedTable">
<tr>
<td>variable</td>
<td width=150>150</td>
</tr>
</table></td>
</tr>
<tr>
<td width="30" class="OuterColumn">30</td>
<td width="30" class="OuterColumn">30</td>
<td class="OuterColumn"><table width="100%" border="1" class="NestedTable">
<tr>
<td>variable</td>
<td width=100>100</td>
</tr>
</table></td>
</tr>
<tr>
<td width="30" class="OuterColumn">30</td>
<td colspan="2" class="OuterColumn"><table width="100%" border="1" class="NestedTable">
<tr>
<td>variable</td>
<td width=100>100</td>
</tr>
</table></td>
</tr>
</table>
<table cellpadding="0" cellspacing="0" width=100%>
<tr>
<td colspan="3" class="OuterColumn"><table width="100%" border="1" class="NestedTable">
<tr>
<td>variable</td>
<td width="100">100</td>
</tr>
</table></td>
</tr>
<tr>
<td width="30" class="OuterColumn">30</td>
<td colspan="2" class="OuterColumn"><table width="100%" border="1" class="NestedTable">
<tr>
<td>variable</td>
<td width=100>100</td>
</tr>
</table></td>
</tr>
<tr>
<td width="30" class="OuterColumn">30</td>
<td width="30" class="OuterColumn">30</td>
<td class="OuterColumn"><table width="100%" border="1" class="NestedTable">
<tr>
<td>variable</td>
<td width=150>150</td>
</tr>
</table></td>
</tr>
<tr>
<td width="30" class="OuterColumn">30</td>
<td colspan="2" class="OuterColumn"><table width="100%" border="1" class="NestedTable">
<tr>
<td>variable</td>
<td width=100>100</td>
</tr>
</table></td>
</tr>
</table>
<table cellpadding="0" cellspacing="0" width=100%>
<tr>
<td colspan="3" class="OuterColumn"><table width="100%" border="1" class="NestedTable">
<tr>
<td>variable</td>
<td width="100">100</td>
</tr>
</table></td>
</tr>
<tr>
<td width="30" class="OuterColumn">30</td>
<td colspan="2" class="OuterColumn"><table width="100%" border="1" class="NestedTable">
<tr>
<td>variable</td>
<td width=100>100</td>
</tr>
</table></td>
</tr>
<tr>
<td width="30" class="OuterColumn">30</td>
<td width="30" class="OuterColumn">30</td>
<td class="OuterColumn"><table width="100%" border="1" class="NestedTable">
<tr>
<td>variable</td>
<td width=100>100</td>
</tr>
</table></td>
</tr>
<tr>
<td width="30" class="OuterColumn">30</td>
<td colspan="2" class="OuterColumn"><table width="100%" border="1" class="NestedTable">
<tr>
<td>variable</td>
<td width=150>150</td>
</tr>
</table></td>
</tr>
</table>
</body>
</HTML>
Before you criticize a man, walk a mile in his shoes. That way, when you do criticize him, you'll be a mile away and have his shoes.
|
|
|
|
|
Using an absolute width (100px) in the inner table overrides the relative setting of the outer table (100%). The padding seems to adjust to accomodate the absolute setting.
Word of the day: Rotundacrat
Extra Credit will be awarded for: Quasimobo...
|
|
|
|
|
Roger Wright wrote:
Using an absolute width (100px) in the inner table overrides the relative setting of the outer table (100%).
Its the other way around....  Have a closer look again at the HTML. As it is in my 1st post, it renders correctly, but changing one width (the 1st one), it messes up the rest. So we will have the following and comapre that to the first post. VS.NET added all the """'s and removed the "px", but the effect is the same. I added some text for clarity.
Maybe not a bug, but a serious flaw if you ask me
Before you criticize a man, walk a mile in his shoes. That way, when you do criticize him, you'll be a mile away and have his shoes.
|
|
|
|
|
In the profile-upload/upload-include.asp file:
Class FileUploader
................
Public Property Get Form(sIndex)
Form = ""
If mcolFormElem.Exists(LCase(sIndex)) Then Form = mcolFormElem.Item(LCase(sIndex))
End Property
..................
End Class
Can someone explain to me what that underlined parts mean?
And in photos/upload-photos.asp file:
set uploader = new fileuploader
if uploader.form("action") = "add"
uploader.form("description");
How can these be done?Are there any linkages?
I hope you know my meaning.
Thanks.
this is my signature for forums quoted from shog*9:
I can't help but feel, somewhere deep within that withered, bitter, scheming person, there is a small child, frightened, looking a way out.
|
|
|
|
|
Hiya,
I have a problem with CreateObject. I'm writing a webapp for the company
intranet. All user PC's have office 97 installed running on an NT 4
platform, the servers don't have office installed.
One function of my app is that it generates an Excel chart. It does this
using client-side VBScript. On my PC, when I execute the instruction:-
Set xlApp = CreateObject("Excel.Application")
Excel loads into memory (confirmed by checking Task Manager)
On any other PC (well, 3 others I have tried) Excel doesn't load. Any ideas
why? 
Cheers,
Rob
|
|
|
|
|
|
Cheers for the quick response. The setting that should have enabled this to work is:-
Initialise and script ActiveX controls not marked as safe.
By default this is set to Disable. I had already set it to Enable but alas, no joy.
|
|
|
|
|
Hi, everyone!
I want to let user use Web to transfer their file
from local machine to a remote site. I do not know
how to use JSP to do that.
Where can I get some sample codes?
Cheers,
George
|
|
|
|
|
I'm not sure if the solution to my problem would actually be a web programmer's job, but I'm hoping that one of you may have had a similar need. Here it is:
I am setting up wireless internet for a hotel major hotel chain. Only one computer (one of the hotel's servers) will actually have the wireless modems, but will supply internet for each room. The ideal situation is this: 1-The user plugs their computer into the network jack (no internet access at this point). 2-They open up their preferred browser and instead of their homepage, it will display a page on our internal network. 3-They will go through a process to activate their room.
The problem that I have is dsplaying our page instead of their homepage. How would I intercept this? Would I have to write a pseudo HTTP server?
Thanks,
Josh Koppang
Wiacomm, Inc.
There's a fine line between confidence and arrogance.
|
|
|
|
|
I think you will need to write an ISAPI Filter for your intranet, although I'm not sure, just a thought
Philip Patrick
Web-site: www.stpworks.com
"Two beer or not two beer?" Shakesbeer
|
|
|
|
|
Josh Koppang wrote:
The problem that I have is dsplaying our page instead of their homepage. How would I intercept this? Would I have to write a pseudo HTTP server?
Your best bet is to use a proxy server in transparent mode (like Squid or ISA Server). This will ensure the person HAS to go via this server regardless of there personal settings. Now, I dont know how to set it up on either of the 2, but it should not be too difficult
Hope this helps
Before you criticize a man, walk a mile in his shoes. That way, when you do criticize him, you'll be a mile away and have his shoes.
|
|
|
|
|
Hi all
First all, as usual everything works 100% in IE5/6. Now this is what MS's function looks like and works in Netscape
<script language="javascript">
<!--
function __doPostBack(eventTarget, eventArgument) {
var theform = document.Form1;
theform.__EVENTTARGET.value = eventTarget;
theform.__EVENTARGUMENT.value = eventArgument;
theform.submit();
}
</script>
And here's mine. But it is located in a scrips file. Not on the webpage.
In the webpage:
<script language="javascript" src="scripts.js"></script>
In scripts.js:
function GotoPage(page)
{
document.Form1.Page.value = page - 1;
document.Form1.submit();
}
Does %$#$ all  Is there a trick? What was that figure of IE users world wide ?
Before you criticize a man, walk a mile in his shoes. That way, when you do criticize him, you'll be a mile away and have his shoes.
|
|
|
|
|
|
Hi again...
I found the problem
I didnt actually post that line that caused it 
Form1.whatever needs to be document.Form1.whatever
Thanx again
Before you criticize a man, walk a mile in his shoes. That way, when you do criticize him, you'll be a mile away and have his shoes.
|
|
|
|
|
I would like to use chris's script for showing the date on my webpage, but how could I display the date output in bold, I have tried to follow all the FAQ's but I am a complete novice in javascript.
thanks
|
|
|
|
|
Just place the output in <b>bold</b> tags
Before you criticize a man, walk a mile in his shoes. That way, when you do criticize him, you'll be a mile away and have his shoes.
|
|
|
|
|
Thanks for the suggestion,but it doesn't seem to work the output script is as follows:
<script Language="JavaScript">
<!--
document.write("" + DateString() + "\n");
//--><br>
</script>
where would I put the <b> tags, I have tried putting them before the document.write and after the \n"); but even that doesn't work.
Any help would be apreciated
Steve
|
|
|
|
|
<script Language="JavaScript">
<!--
document.write("<b>" + DateString() + "</b>\n");
//-->
</script>
That should do it.
<small><b>Before you criticize a man, walk a mile in his shoes. That way, when you do criticize him, you'll be a mile away and have his shoes.</b></small>
|
|
|
|
|
Leppie, checking the Display this message as-is box totally screws with your sig. You just might want to consider using the < and > buttons that are down on the formatting bar.
Norm Almond: I seen some GUI's in my life but WTF is this mess 
Leppie: I made an app for my sister and she wouldnt use it till it was colorful enough
Norm:good point leppie, from that statement I can only deduce that this GUI must be aimed at children
Leppie:My sister is 25
-Norm on the MailMagic GUI
|
|
|
|
|
David Stone wrote:
You just might want to consider using the < and > buttons that are down on the formatting bar.
I used them previuosly, and they screwd up a link
I dont really care though  But thanx for the thought
Before you criticize a man, walk a mile in his shoes. That way, when you do criticize him, you'll be a mile away and have his shoes.
|
|
|
|
|
General 
News 
Suggestion 
Question 
Bug 
Answer 
Joke 
Praise 
Rant 
Admin 
Submit an article or tip
