|
HTML - Tables Question
I'm having some trouble with a table and I don't know why. The only way I can get the result desired is with this code:
Code: <tr> <td class="author" style="padding-top:5px;" height="16"><i>Last Updated: October 19, 2011</i> nbsp; <b>Mock Draft:</b> Picks 1-16 - Picks 17-32 - Round 2 - Round 3 </td> </tr> ...which obviously isn't desirable. I can't add a second column, like this: Code: <tr> <td class="author" style="padding-top:5px;" height="16"><i>Last Updated: October 19, 2011</i></td> <td class="author" style="padding-top:5px;" height="16"><i>Last Updated: October 19, 2011</i></td> </tr> ...it pushes the second column off the page. Here are screenshots: Desired - http://img717.imageshack.us/img717/4426/goods.jpg BAD - http://img12.imageshack.us/img12/3955/badfj.jpg Here's the page I'm working with, it's not live yet, looks fine on the page because it's got the long string of http://tinyurl.com/3o5xrhj Sorry for the coding mess, I try my best but I'm still learning a lot. Thanks for the help. Similar TutorialsHi everyone. Here is my website: www.last-tube.com ....it is a web site to help londoners quickly find out what time the last london underground train is (the tfl website makes you download a pdf and complicated timetable!) ***I know none of the links work, they are stored locally at the moment, I'm still at an early stage*** Anyway you can see that I have the main content in the middle with five boxes on either side. Obviously the main content of the page is encapsulated in a single <td></td>. At the moment when you click a link it loads another page identical to the index but with different content. I have realised that I am going to need a few hundred pages to cover all the stations and this approach is impractical because if I need to make a chage to index I need to change every single page of the site which will be a long process! So is it possible to update the content within <td></td> rather the redirect to a new page every time? I am sure there is a workaround to this but I am not smart enough to work it out and have been out of the html game for a while! Any advice would be appreciated! Thanks. Hi, I would like to construct a table which has a unique link for each column. I am extremely new to HTML and other web technologies. I have tried to figure out if I can use colgroup and onClick="window.open('http://yahoo.com','_blank');" but I honestly have no idea what to do. Suggestions? Please and Thank you very much. Does anyone know how to fix this? as you can see, there's random content at the bottom left there. it's not supposed to be and is supposed to be located in the column that's very wide there, but for some reason is throwing it down below the left column. how can i fix this? http://erocsteady.freehostia.com/tes...ents/index.php ^you can see what im talking about here Hi I am trying to code a website which is subdivided (using tables) into a navigation side bar and content area. How is it possible to allow my various html pages be displayed in the content area (without opening a new window) when i click on a link in the navigation bar? gary hey guys, i'm faily new to html, i only have one semester of html so far. i am doing my final project for my html class and i was wondering if anyone could help me out with this. the spaces underneath my images in my table... they weren't there before i made the page xhtml complaint, but as soon as i added the doctype in, they popped up, can anyone help me fix this? I checked over all the tags, and everything seems to be closed off properly. thanks a lot. I would like to know if it is possible to have a table column on top of a column??? In my table, I have a column that contains an image. Next I want to put text on top of the image. I am good up to this point, but when I put the text in this particular column, it is left justified and is not giving me the look I want. So, can I add another column on top the one with the image in order to be able to get some white space between the background image and the text on top???? To see what I am talking about, take a look here. It is the right hand column. You'll see how the text just does not look right the way I have it. Thanks for any suggestions. Vance Is there a code to hide the scroll bar on the right altogether? I know there are some to change the colors, positioning, etc. I've decided to make a personal photography portfolio on my computer, and have thought that the best way to do this would be HTML. My problem: See the above image? The items in red circles are just copied and pasted from the original in the top-left. What I want to know is how do I actually get them there in HTML? I think it's something to do with tables, but as I'm practically brand new to HTML I'm not sure. I have a ZIP file below with all the necessary files, just unzip the online folder and edit the 'index.htm' file if you want to do it all yourself for me. Otherwise, you can use it to have a look at the coding I've used (partly taken from a free HTML template website, I admit ). Thanks very much in advance for help. I want to create a two column table that, in one of the rows, has a large picture in the second column. I wanted to "wrap" the picture in a <div> and give the div scroll bars so the user can scroll horizontally and vertically to see the entire picture, but still keep the width of the table as the same size as the width of the browser window. The div part seems to work fine. The large picture appears in the smaller div and the div has the scroll bars that I want. But, the table is still sized to contain the ENTIRE width of the photo, so the other rows in the table go off the edge of the browser window (because the image is wider than the browser window). Is there a way that I can limit the table width to only be the width of the browser, and have a large photo contained in a scrolling div, within one of the table rows. I will include some basic HTML code to demonstrate the problem. Just insert a path to some large image you might have, for testing, into the image tag's src property. (the image I am using is 1600x1200) Thanks, in advance, for any help you can provide. Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Test a Large Image in a Table</title> </head> <body> <table style="border-bottom-width:thin"> <tr style="width:300px;"> <td style="width:20%; background-color:gray"> Title #1 </td> <td style="width:80%; background-color:red""> Why does this row go past the edge of the page? </td> </tr> <tr style="width:300px;"> <td style="width:20%; background-color:gray"> Title #2 </td> <td style="width:80%"> <div style="overflow:auto; max-width:60em; min-width:15em;"> <img src="" alt="some large image" /> </div> </td> </tr> </table> </body> </html> Hey. Is it possible to have a line seperating the collums of a table but having no lines for rows. Bascially i want to do what i have poorly added in in Paint http://img526.imageshack.us/img526/3883/15247409oe7.jpg Is this possible to do? Thanks in advance Last time I posted I was told I needed to get rid of the tables from my code. Im still trying to learn CSS properly and make the changes as I go. looking at my layout surrenderyourwings.com/layout.html I realize it should be 3 divs from left to right, one for the images one for the content and one for the details my question is: the details column on the right "payment shipping etc" Should each of the individual "cells" be a nested div? or is there a different or more correct way to convert and simplify this? thanks I have to divide the page to 3 columns. These 3 columns should adjust according to the size of the screen. The left and right most columns will be pretimuch don't change much in size. The middle colum has content of verity of sizes. How can I adjust the columns to adjust to the screen size from 10Inch to 30Inch? Thanks in advance for Help. Regards, Swaroop Kunduru. Hello, just starting here I complete the HTML an CSS tutorials at http://www.w3schools.com/ I also downloaded a trial for coffeecup I am helping a local business with their website, it is very simple, just content and a couple of pictures. For some reason, as much as I google it up I cannot figure out how to add a left column to the site. the examples I find, even free templates from Amaya use tables. I dont want to use tables, I guess I need to use div? But if that is so, how do I position my column? It seems w3schools gave me a good start but I am having problems putting the concepts together. If you can direct me to the right answer, or recommend a book or tutorial that actually builds a simple site with a couple of columns in good design, I would really appreciate it. But I dont want to use tables as I learned it is not best practice Thank you! i used to use tables for the layout, now i'm trying divs..the thing is i'm not sure how should i think about the layout, i mean like tables i have rows, every row have cells, now with the divs i should think about it the same way? a container div to replace the main table, then another div to take place of a row, then divs as cells..an so on does that make any sense? i don't know if that was clear, but the question is: how should i think about it? i know the question sounds stupid but it seems that i just got used to tables & can't accept divs yet Hi Normally, when you have more than one table in your code, the tables will be placed one under each other. Example: <table> ... </table> <table> ... </table> When you want the tables to be placed next to each other, you need to set the align attribute. Example: <table align="left"> ... </table> <table align="left"> ... </table> BUT: When you do it like in the 2nd example (tables next to each other), in Firefox, the tables will wrap to a new line if there is no more space. In Internet Explorer, the tables will not wrap. The result is a horizontal scrollbar or "hidden tables". Why this? How can I make the tables wrap also in Internet Explorer as it does in Firefox? Is it possible with a special CSS definition or with a special DIV/SPAN tag? Thanks for your help praiser Hey everyone, I'm new to these boards. Somewhat a newbie at web design, but I know basics. I'm looking to put 2 tables adjacent to each other inside another table. My problem is I can't get the tables to line up the way I want them to. I'll post a picture of how I want it to look, how it looks now and my code. How I want it to look: How it looks now: I want the tables to line up at the top and re-size according to each other so they're always aligned at the top. Code: coming in next 2 posts I've been having some issues with my site. It looks fine in IE but it doesn't look correct in Firefox, Opera and Safari. The tables are misaligned and I am at a total loss. Can anyone help me out. Thanks here is the link; http://wwwdotcapleeconsultingdot.com I have a L shaped image that I want to put into a table as a whole rather than cut into to two oblongs. As I am not an expert I wondered if this would mean that the space surronding the L shapped image will not be accesble when place in the table.. I want to put txt into the recess against the right angle formed by the L I think that the <td><img src="Lshape"/></td > way that the table structure works that the L will have a rectangle around it and that this will prevent things butting close to it.. is there a way around it.. Apart from cutting the L shape into two pieces and putting a table within a table thanks Larry We have the following code in our header at www.hometheatershack.com ... but I'm thinking it ain't right and am wondering if someone could look at it and tell me if I can improve on the code. Code: <table border="0" width="$stylevar[outertablewidth]" cellpadding="0" cellspacing="0" align="center"> <tr> <td rowspan="4" width="30%" align="left"><a href="/"><img src="/images/htslogo20.gif" border="0" alt="Home Theater Shack" /></a></td> <td rowspan="4" width="40%"></td> <tr> <td width="10" align="right" valign="bottom"> <!-- SVS Banner --> <a href='http://www.hometheatershack.com/openads/www/delivery/ck.php?n=adf57b41&cb=$includedphp' target='_blank'><img src='http://www.hometheatershack.com/openads/www/delivery/avw.php?zoneid=3&cb=$includedphp;&n=adf57b41' border='0' width='192' height='54' alt='SVSound' /></a> <!-- End SVS Banner --> </td> <td> </td> <td width="10" align="right" valign="bottom"> <!-- GIK Banner --> <a href='http://www.hometheatershack.com/openads/www/delivery/ck.php?n=a21b1e29&cb=$includedphp' target='_blank'><img src='http://www.hometheatershack.com/openads/www/delivery/avw.php?zoneid=6&cb=$includedphp&n=a21b1e29' border='0' width='192' height='54' alt='GIK Acoustics' /></a> <!-- End GIK Banner --> </td> <td> </td> <td width="10" align="right" valign="bottom"> <!-- Ultimate Banner --> <a href='http://www.hometheatershack.com/openads/www/delivery/ck.php?n=ac45af25&cb=$includedphp' target='_blank'><img src='http://www.hometheatershack.com/openads/www/delivery/avw.php?zoneid=7&cb=$includedphp&n=ac45af25' border='0' width='192' height='54' alt='Ultimate Home Entertainment' /></a> <!-- End Ultimate Banner --> </td> <td> </td> </tr> <tr> <td width="10" align="right" valign="top"> <!-- Fi Audio Banner --> <a href='http://www.hometheatershack.com/openads/www/delivery/ck.php?n=a7b0e02e&cb=$includedphp' target='_blank'><img src='http://www.hometheatershack.com/openads/www/delivery/avw.php?zoneid=9&cb=$includedphp&n=a7b0e02e' border='0' alt='Fi Audio' /></a> <!-- End Fi Audio Banner --> </td> <td> </td> <td width="10" align="right" valign="top"> <!-- SoundSplinter Banner --> <a href='http://www.hometheatershack.com/openads/www/delivery/ck.php?n=acf07dac&cb=$includedphp' target='_blank'><img src='http://www.hometheatershack.com/openads/www/delivery/avw.php?zoneid=8&cb=$includedphp&n=acf07dac' border='0' alt='SoundSplinter' /></a> <!-- End SoundSplinter Banner --> </td> <td> </td> <td width="10" align="right" valign="top"> <!-- Discount Merchant Banner --> <a href='http://www.hometheatershack.com/openads/www/delivery/ck.php?n=a11ec3d3&cb=$includedphp' target='_blank'><img src='http://www.hometheatershack.com/openads/www/delivery/avw.php?zoneid=10&cb=$includedphp&n=a11ec3d3' border='0' alt='Discount Merchant' /></a> <!-- End Discount Merchant Banner --> <br /><br /> </td> <td> </td> </tr> </table> Thanks! Sonnie Code: <table width="400" border="2" class="pay" id="pay">
<col class="itemsDesc" />
<colgroup span="2" class="firstCol" />
<colgroup span="1" class="feeCol" />
<thead>
<tr>
<th>Lessons</th>
<th>Per Term</th>
<th>Per Year</th>
</tr>
</thead>
<tbody>
<td>30 minutes</td>
<td>$600</td>
<td>$1100</td>
</tr>
<tr>
<td>45 minutes</td>
<td>$850</td>
<td>$1600</td>
</tr>
<tr>
<td>60 minutes</td>
<td>$1100</td>
<td>$2100</td>
</tr>
</tbody>
</table>
and my css: Code: * {margin: 0px; padding: 0px}
body {font-size: 14px;
font-family: 'Lucida Grande', Verdana, sans-serif}
table.pay {table-width: 400px; border: 10 px outset rgb(68, 76, 169)}
table.pay thead {background-color: ivory; border: 1px}
table.pay col.firstCol {background-color: rgb(255, 255, 192)}
table.pay col.feeCol {background-color: rgb(232,232,255)}
table.itemsDims {width:12%;}
im supposed to create a heading row group, a body row group, and column groups containing one column element belonging to the firstCol class, and another column element belonging to the feeColumns class which should span two columns in the web table. was just wondering where im going wrong here since when i do my css.. the background colors or no changes seem to be applied to the columns or the headers (thead) |
|||||||