HTML - Resizing A Table Withing A Frame
I have a table with the height attribute set to 100%. This is displayed within a frameset. The table has a thin border on the right, and I want this to be continuous for the full height of the frame when displayed, irrespective of the content.
The problem is that the table doesn't fill the frame, so the border stops leaving a gap. How can I get the table to resize to fill the frame? Similar TutorialsI'm using the example frame as laid out he http://www.quackit.com/html/template...example_6.html and I'm struggling to figure out how to resize the 'Related' frame. I want to make it stretch to the top and bottom of the page (therefore making the width of the top and bottom rows smaller). The frame set code is: <frameset rows="100,*,80" frameborder="0" border="0" framespacing="0"> <frame name="topNav" src="top_nav.html"> <frameset cols="200,*,200" frameborder="0" border="0" framespacing="0"> <frame name="menu" src="menu_1.html" marginheight="0" marginwidth="0" scrolling="auto" noresize> <frame name="content" src="content.html" marginheight="0" marginwidth="0" scrolling="auto" noresize> <frame name="related" src="related.html" marginheight="0" marginwidth="0" scrolling="auto" noresize> </frameset> <frame name="footer" src="footer.html"> </frameset> </html> and the codes for the frames can be found he http://www.quackit.com/html/examples...ple_6_code.cfm To give you an idea of what I'm trying to achieve, I want to make the right hand lion extend up and down so that when the page resizes, the colours for the top and bottom borders will always match seamlessly. At the minute I have only managed to make the horizontal JPG smaller, not the actual frame. Hello. I am currently making a website using tables. Basically I'm collecting php data feeds from an open-source CMS and feeding the data into different table cells via a php tag in each. I'm using a single background image for the whole table as I want that image to stay the same and I can't really use CSS for this. However, I cannot keep my table the same size. Of course, when my table shifts, it knocks all my data out of line and it doesn't sit right with the background image anymore. It is only about 780 pixels wide and I don't want it to resize with browsers etc, the size it is is fine to stay like that all the time. The text that is feeding into it doesn't appear to be wrapping and then just stretches the table, even though I've specified widths etc already. Any help would be much appreciated. Ta. Hello everybody, I'm writing here because I'm having a problem with Chrome resizing a table. I have a table representing one day (24 hours). In this table I draw activity bars using colspan. The precision for activities start/stop is 2 minutes, so I draw a table containing 30*24 <td/> tags. The table has 100% width as I want the chart to be resizable. The result is great in Firefox and IE8 (all columns resize the same way), but in Chrome, when downsizing page width, the columns resize one after the other, starting from the first. So the chart scale gets corrupted. Here is a sample code I used to reproduce the issue : Code: <html> <body> <table border="1" cellspacing="0" cellpadding="0" style="table-layout:fixed;width:100%;word-wrap:break-word;"> <tr> <td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/> </tr> <tr height="30" valign="middle" align="left"> <td colspan="30" align="left" style="border-right:1px solid #dddddd;"><div style="padding-left:1ex;">0h</div></td> <td colspan="30" align="left" style="border-right:1px solid #dddddd;"><div style="padding-left:1ex">1h</div></td> <td colspan="30" align="left" style="border-right:1px solid #dddddd;"><div style="padding-left:1ex">2h</div></td> <td colspan="30" align="left" style="border-right:1px solid #dddddd;"><div style="padding-left:1ex">3h</div></td> <td colspan="30" align="left" style="border-right:1px solid #dddddd;"><div style="padding-left:1ex">4h</div></td> <td colspan="30" align="left" style="border-right:1px solid #dddddd;"><div style="padding-left:1ex">5h</div></td> <td colspan="30" align="left" style="border-right:1px solid #dddddd;"><div style="padding-left:1ex">6h</div></td> <td colspan="30" align="left" style="border-right:1px solid #dddddd;"><div style="padding-left:1ex">7h</div></td> <td colspan="30" align="left" style="border-right:1px solid #dddddd;"><div style="padding-left:1ex">8h</div></td> <td colspan="30" align="left" style="border-right:1px solid #dddddd;"><div style="padding-left:1ex">9h</div></td> <td colspan="30" align="left" style="border-right:1px solid #dddddd;"><div style="padding-left:1ex">10h</div></td> <td colspan="30" align="left" style="border-right:1px solid #dddddd;"><div style="padding-left:1ex">11h</div></td> <td colspan="30" align="left" style="border-right:1px solid #dddddd;"><div style="padding-left:1ex">12h</div></td> <td colspan="30" align="left" style="border-right:1px solid #dddddd;"><div style="padding-left:1ex">13h</div></td> <td colspan="30" align="left" style="border-right:1px solid #dddddd;"><div style="padding-left:1ex">14h</div></td> <td colspan="30" align="left" style="border-right:1px solid #dddddd;"><div style="padding-left:1ex">15h</div></td> <td colspan="30" align="left" style="border-right:1px solid #dddddd;"><div style="padding-left:1ex">16h</div></td> <td colspan="30" align="left" style="border-right:1px solid #dddddd;"><div style="padding-left:1ex">17h</div></td> <td colspan="30" align="left" style="border-right:1px solid #dddddd;"><div style="padding-left:1ex">18h</div></td> <td colspan="30" align="left" style="border-right:1px solid #dddddd;"><div style="padding-left:1ex">19h</div></td> <td colspan="30" align="left" style="border-right:1px solid #dddddd;"><div style="padding-left:1ex">20h</div></td> <td colspan="30" align="left" style="border-right:1px solid #dddddd;"><div style="padding-left:1ex">21h</div></td> <td colspan="30" align="left" style="border-right:1px solid #dddddd;"><div style="padding-left:1ex">22h</div></td> <td colspan="30" align="left"><div style="padding-left:1ex">23h</div></td> </tr> </table> </body> </html> Any idea about what's going on? Thank you very much for your help Stephane Hi Can someone tell me how I can stop an image from moving behind a table - next to it - when the browser window is reduced? Here's the page http://www.tall-shiprace.com/2009/04/19/1247/ When I re-size (from the bottom right corner of the browser) the image floats behind the table - to the left of the image. Can this be stopped?? Hello, could someone point me to where I can read about making a table work as a frame? I have 4 images, which are pages, I would like to have them displayed in a table below without refreshing the page when I click on them. Please see the attachment! The buttons are in flash, if that is helpful. Thanks! i want to open a frame by clicking on a cell,i can only do this when the ref is outside the table,can you help? Thanks everybody Hi there, I'm experiencing a strange problem in IE with the show-hide layers behavior. I have 4 layers, each with images inside them which are meant to link to other pages. This works fine in Firefox but not so in IE. The odd thing is that when you hover over the images in IE the link appears in the status bar and if you right click and choose "open link" it does work. The site is here www.patons.org/v2/ and its the images at the top that I'm talking about. Any help would be much appreciated. Thanks, Alex does anyone know how to align a table to sit flush up against a frame border thx http://www.users.on.net/~bmccowan/ex.JPG I'm fairly new to html, so if it's something obvious, give me a break. I have a background image with blank sections where I want to put stuff in to, and in one of the sections I want to put a frame or a table so I can have a list of links which you can scroll through, but I don't know how to put it anywhere I want on the page. Any help would be great, thanks. Greetings, I'm familiar with coding, but not a genius by any means. I've ran this by a few HTML guys and neither have had any luck. I am trying to come up with a template for a webpage. I would like the basic layout of: This page My goal is to have the frame layout the same with the following: Top Left frame - Logo Bottom Left frame - undecided, probably contact information Left frame - navigation links Bottom frame - content I'd like the top 3 frames to stay stationary (even when going to another internal link), and the bottom page able to scroll and change content when necessary. I'm able to see the layout fine in Firefox, but not IE 6.0 One of the HTML guys suggested using a table instead of frames to get the same effect. We were able to view it in IE, however could not get the top 3 cells to stay stationary while the bottom moved. Someone mentioned iframes, but I don't know anything about them or how to implement them. Could someone look at the 2 sets of code and see if the above mentioned idea is possible (and obviously how to make it work if so)? I don't care if its frames or table, as long as it works, hehe. Frame Code: Code: <html> <head> <title> The Page Name </title> <meta name="keyword" content="blah" /> <meta name="description" content="I hope this works" /> <meta name="robots" content="all" /> </head> <FRAMESET ROWS="75,*"> <NOFRAMES> <BODY BGCOLOR="#FFFFF0"><CENTER>Your browser does not suport frames. </CENTER> </NOFRAMES> <FRAMESET BORDERCOLOR="RED" COLS="200,*"> <FRAMESET ROWS="23,23"> <FRAME MARGINWIDTH="1" MARGINHEIGHT="1" NAME="logo" SRC="logo.htm" SCROLLING="no"> <FRAME MARGINWIDTH="1" MARGINHEIGHT="1" NAME="counter" SRC="counter.htm" SCROLLING="no"> </FRAMESET> <FRAME MARGINWIDTH="1" MARGINHEIGHT="1" NAME="menu" SRC="menu.htm" SCROLLING="no"> </FRAMESET> <FRAME FRAME MARGINWIDTH="35" MARGINHEIGHT="1" NAME="main" SRC="main.htm"> </FRAMESET> </body> </html> -------------------------------------- Table Code: Code: <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <meta http-equiv="content-type" content="text/html; charset=ISO-8859-1"> <title>table</title> <style ="text/css"> body{ margin: 0px; } </style> </head> <body> <table style="text-align: left; width: 100%; height: 100%;" border="1" cellpadding="0" cellspacing="0"> <tbody> <tr> <td style="width: 200px; height: 37px;">a</td> <td colspan="1" rowspan="2">a</td> </tr> <tr> <td style="height: 37px;">a</td> </tr> <tr> <td style="vertical-align: top;" colspan="2" rowspan="1">a</td> </tr> </tbody> </table> <br> </body> </html> I appreciate any and all feedback. Thanks. Hi Forum!! Okay I'm using an image map (well sliced image...I dont know if theres a difference) and I'm trying to get the imape map links to open up in either a table or a frame below. I didnt know if you can target images into a table...thats why I said or. Right now I have a table with a frame inside of it although I don't tihnk my frame code is right and the frame isnt really there. Here is a link to the outline of fanlisting ---I have ALOT of bugs to work out as you will see. www.geocities.com/diesel_girl35/index.html The actual links in my image map is working but Im not sure how to direct them to where I want them to go. And my table is too small... I wanted it to be the width of the image..which I think I can figure out. BTW if anyone has any suggestions on a better way to accomplish what I'm trying to accomplish please advise me =} And here is what my image map code looks like..if it will help. So should I target into a table or frame and how would I go about getting everything to work right? PLEASE AND THANK U <!-- Begin Table --> <TABLE BORDER="0" CELLPADDING="0" CELLSPACING="0" WIDTH="856" HEIGHT="447"> <TR> <TD ROWSPAN="1" COLSPAN="6" WIDTH="856" HEIGHT="407"> <IMG NAME="ino_menu30" SRC="ino_menu3_1x1.png" WIDTH="856" HEIGHT="407" BORDER="0"></TD> </TR> <TR> <TD ROWSPAN="1" COLSPAN="1" WIDTH="75" HEIGHT="40"> <A HREF="http://www.geocities.com/diesel_girl35/ino_about.html" target="about"><IMG NAME="ino_menu31" SRC="ino_menu3_2x1.png" WIDTH="75" HEIGHT="40" BORDER="0" ALT="About Its Not Over"></A></TD> <TD ROWSPAN="1" COLSPAN="1" WIDTH="74" HEIGHT="40"> <A HREF="http://www.geocities.com/diesel_girl35/ino_rules.html"><IMG NAME="ino_menu32" SRC="ino_menu3_2x2.gif" WIDTH="74" HEIGHT="40" BORDER="0" ALT="Know The Rules"></A></TD> <TD ROWSPAN="1" COLSPAN="1" WIDTH="86" HEIGHT="40"> <A HREF="http://www.geocities.com/diesel_girl35/ino_codes.html"><IMG NAME="ino_menu33" SRC="ino_menu3_2x3.gif" WIDTH="86" HEIGHT="40" BORDER="0" ALT="Get Sum Codes"></A></TD> <TD ROWSPAN="1" COLSPAN="1" WIDTH="71" HEIGHT="40"> <A HREF="http://www.geocities.com/diesel_girl35/ino_join.html"><IMG NAME="ino_menu34" SRC="ino_menu3_2x4.gif" WIDTH="71" HEIGHT="40" BORDER="0" ALT="Become A Fan"></A></TD> <TD ROWSPAN="1" COLSPAN="1" WIDTH="79" HEIGHT="40"> <A HREF="http://www.geocities.com/diesel_girl35/ino_xtra.html"><IMG NAME="ino_menu35" SRC="ino_menu3_2x5.jpg" WIDTH="79" HEIGHT="40" BORDER="0" ALT="More Stuff"></A></TD> <TD ROWSPAN="1" COLSPAN="1" WIDTH="471" HEIGHT="40"> <IMG NAME="ino_menu36" SRC="ino_menu3_2x6.gif" WIDTH="471" HEIGHT="40" BORDER="0"></TD> </TR> </TABLE> <!-- End Table --> Hi there, I was wondering if anyone knows how to centre an image link in another frame (yes I know frames are bad but its an old website I am updating) i have <a href="picturelink" target="mainframe"> <img src="thumbnail" border="0"></a> I have tried everything from class="center" to editing the original frameset and the original page loaded into the window but I can't get the jpeg file to load up centred and so I was hoping someone might be able to help as I don't want to link all the pictures to seperate html documents with only a centred image in... Thanks for any help. Hey. I have a frame and inside it there is a link. I want it to target an anchor called Code: <a name="anchor"></a> that is INSIDE it's own frame. I tried Code: <a href="#anchor"> but it tries to reload the entire page, and doesn't just "jump" to the anchor like it normally would. How do I do this? Thanks Here is the code that I am using; Code: <table frame="vsides"> <td> Testing123 </td> </tr> </table> And here is the site with the result; http://radicalwriting.uphero.com/ For some reason it never works quite right, I don't think it's a syntax error. Only thing I could think of would be wrong doctype. Any thoughts? Hi! I am using Dreamweaver 8 to develope my site. I have broken the page in three pieces(frames) So that the top frame shows the title, the left frame is for links that I want to show as flash movies in the right frame. I have studied the help file and I have looked on the web and I can't find an explanation that I can understand on how to do this. I believe the clickable link should be an href but I don't know how to code it. Can someone explain this to me? Thanks in Advance! Paul Hello, I'm kinda new to HTML, but have used it for a long time, just haven't used it to do stuff from scratch before. I was wondering how I would set up a page to resize and not have scrollbars. I'll attach an example. I want there to be a footer that will ALWAYS be at the bottom of the window, not just the content. I wan to have a middle section that will stretch between my header and footer, and I want it to have somewhat of an internal scrollbar if the content inside is bigger than the window: Code: The header footer, and middle section should fill the browser window ----------------------------------------------- header ----------------------------------------------- xxxxxxxxxxxxxxxxxx[^] -------------- xxxxxxxxxxxxxxxxxx| | | content: height=100%| | | | xxxxxxxxxxxxxxxxxx| | | | xxxxxxxxxxxxxxxxxx| | | more | xxxxxxxxxxxxxxxxxx| | | here | xxxxxxxxxxxxxxxxxx[v] _________| ------------------------------------------------ footer(bottom aligned to browser window ------------------------------------------------ Ok the ASCII isn't working too well... EDIT: Ok I got the footer working, but what about making the middle part span the width from the bottom of the header to the top of the footer without stretching out the page? Hi there, I have some text inside a layer and I am pretty happy with it. Trouble is that I would like to disable the resizing from the browser so that the user cannot choose a text size that would mess up my text. I am refering to "View > Text Size" in IE. Can u help? Thks Hi, I've created a page in a table that's 1080 pixels width with 3 columns, two side bars that are 165 and 200 pixels with banners and ads and a central panel 600 pixels for content and my screen settings are 1024x768 when I change my screen resolution to a smaller setting the table stays the same size but the content in the three columns shrinks so the page does not fit properly in the table and everything is out of place. What is the best way to format a page to stay the same no matter what the screen resolution or screen size is? Thank you in advance for your help. Sorry it's an intranet site but here is the html. Thanks for the tip Zegron <html> <head> <title>OCC Net</title> </head> <body> <table WIDTH="100%" valign="top" border="2" cellpadding="0" cellspacing="0"> <tr> <td></td> </tr> <tr> <td rowspan="200" width="163" valign="top"> <!--#include file="includes/links.asp"--> </td> <td align="left" valign="top" width="620"> <!--#include file="includes/CenterPanel.asp"--> </td> <td width="220" valign="top" rowspan="200"> <!--#include file="includes/RightMenuHome.asp"--> </td> </tr> </table> </body> </html> Hi, is there a way that a window opens with a specific size? (not the window that opens with a link on a page) for example, when i go into www.gucci.com-the window will automatically resize to their specific size. I want my own website to open in a specific size but im not sure how.. |