Resising Issues

liunx

Guest
<!-- m --><a class="postlink" href="http://www.geocities.com/properline/round_table.jpg">http://www.geocities.com/properline/round_table.jpg</a><!-- m --><br />
<br />
If stupid vB code does not work: image is located at: <!-- m --><a class="postlink" href="http://www.geocities.com/properline/round_table.jpg">http://www.geocities.com/properline/round_table.jpg</a><!-- m --><br />
<br />
Observe the image above. That was taken from Yahoo mail. It appears that it is a Table. ON TOP: One cell for the header, one for the yellow triangle, and one for the white empty space. ON BOTTOM: A big cell spanning 3 collumns with text.<br />
<br />
I, myself, would like to make one of those. But I do not see how it is actually done. If I make text really small or really large, the triangle fits with the header's window. How do I get this effect? Where the triangle does not really apear to be a seperate image? <br />
<br />
Now, what if someone had a realy realy big font? Then it would look like this:<br />
__________________<br />
|The New Yahoo! Mail|<br />
|The New Yahoo! Mail|\<br />
--------------------------\<br />
blahblahblahblahblahbla|<br />
blahblahblahblahblahbla| <br />
blahblahblahblahblahbla|<br />
--------------------------<br />
<br />
(I hope that works art above works for most fonts)<br />
<br />
But the wonderful yahoo programmers have found a way around it. I want to do that too. how do I?<!--content-->You need to check the URL of the image, Geocities said it wasnt found!<!--content-->please attach it or upload it to a more bandwidth-friendly server. thanks.<!--content-->I would do it by:<br />
Having 3 pictures, one for the top bit, the header, the triangle and the space. That would go in a top row of the table.<br />
For the second row, and picture, I would use a picture with two side bars which fit the top picture.<br />
The bottom row would just have a picture which finishes the frame thingy off.<br />
if somehow, you understand that, then you should be able to get the effect.<!--content-->Oh Great! Yahoo has a firewall. Well I attached the picture this time. <br />
<br />
A message to andy: Sure everything is possible with tons of pictures, but I am trying to reduce my effort, allow people to view words in the size they want, and the loading time of others. I like to use yahoo's aproach in using text in the table header, instead of like <!-- w --><a class="postlink" href="http://www.amazon.com">www.amazon.com</a><!-- w --> 's aproach, where they just use pictures for the round table header.<!--content-->Hmm, i tried to do it, but I'm not sure how.<br />
Could you send the URL of where you saw this?<!--content-->mail.yahoo.com<br />
<br />
You must sign in.<!--content-->:rofl: Look at the code for the table:<br />
<br />
<table cellpadding=0 cellspacing=0 border=0 width="100%"><br />
<tr class="bgc" bgcolor="#3f6c96"><br />
<td height=15 rowspan=2 nowrap class="verd"><img src=http://www.htmlforums.com/archive/index.php/"http://us.i1.yimg.com/us.yimg.com/i/space.gif" width=140 height=1><br>&nbsp;&nbsp;<b>The New Yahoo! Mail</b></td><br />
<td valign=top><img src=http://www.htmlforums.com/archive/index.php/"http://us.i1.yimg.com/us.yimg.com/i/us/nt/tr14x15_1.gif" width=14 height=15></td><br />
<td align=right width=99% class="bgf"><img src=http://www.htmlforums.com/archive/index.php/"http://us.i1.yimg.com/us.yimg.com/i/space.gif" width=5 height=1 alt=""></td><br />
</tr><br />
<tr class="bgc"><br />
<td colspan=2><br />
<table cellpadding=0 cellspacing=0 border=0><br />
<tr><br />
<td height=3><br />
</td><br />
</tr><br />
</table><br />
</td><br />
</tr><br />
</table><br />
<table border=0 cellpadding=4 cellspacing=0 class=bd width="100%"><br />
<tr><br />
<td><br />
<table border=0 cellpadding=0 cellspacing=0><tr><td valign=top><img src=http://www.htmlforums.com/archive/index.php/"http://us.i1.yimg.com/us.yimg.com/i/us/pim/sp/pim_newuser1.gif" width=100 height=85></td><td>&nbsp;</td><td valign=middle>Welcome to the new Yahoo! Mail!&nbsp;&nbsp;Now even easier to use, with quick access to Address Book, Calendar, and Notepad.</td></tr><br />
<tr><br />
<td colspan=3 align=center><small><a href=http://www.htmlforums.com/archive/index.php/"JavaScript:NewWin('http://rd.yahoo.com/mail_us/tour/*http://tour.mail.yahoo.com/mailtour.html', 'tour', 200, 100, 650, 400);"><b>Take the Tour</b></a> - <a href=http://www.htmlforums.com/archive/index.php/"http://help.yahoo.com/help/us/mail/new" target="_blank"><b>View our Help</b></a></small><br></td><br />
</tr><br />
</table><br />
</td><br />
</tr><br />
</table><br />
<br />
<br />
Seriously, if I were you, I would really use images for the header.<br />
<br />
1) You can make it prettier using images (and easier)<br />
2) Making that whole table would take at MOST 2 images (1 for header, other for mail)<br />
<br />
Nah, not really. You better wait for someone smarter to help you! Nope, actually, if you check that code, I'm sure you can cope up with something, just replacing mostly everything ;)<!--content-->can anyone tell me why Yahoo saw the need to nest tables in that? i haven't tried it, but it seems to me like this would be easy to do. and without having to nest tables! :rolleyes:<!--content-->
 
Back
Top