HTML - Borders On Individual Cells In Tables
Hello,
I am trying to make an html table that looks something like the following: This is the best I can come up with so far: Which was written using the following code: HTML Code: <table border="1" style="empty-cells: hide" FRAME=VOID> <tr> <td> </td> <td> </td> <td> </td> <td> </td> <td colspan="8" ALIGN=center>100614-c5-2_clm3-2x20_*.nrrd</td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> </tr> <tr> <td> </td> <td>3</td> <td>4</td> <td></td> <td>2</td> <td>3</td> <td>6</td> <td>7</td> <td>16</td> <td>11</td> <td>14</td> <td>15</td> <td> </td> <td>3</td> <td>4</td> <td>7</td> <td>8</td> </tr> <tr> <td NOWRAP><h7>100614-c5-2-redo-2x6_*.nrrd</h7></td> <td>2</td> <td>5</td> <td></td> <td>1</td> <td>4</td> <td>5</td> <td>8</td> <td>9</td> <td>12</td> <td>13</td> <td>9</td> <td> </td> <td>2</td> <td>5</td> <td>6</td> <td>9</td> <td NOWRAP><h7>100615-c5-2-clm4-2x15 *.nrrd</h7></td> </tr> <tr> <td></td> <td>1</td> <td>6</td> <td></td> <td>1</td> <td>2</td> <td>3</td> <td>4</td> <td>5</td> <td>6</td> <td>7</td> <td>8</td> <td> </td> <td>1</td> </tr> <td> </td> <td> </td> <td> </td> <td> </td> <td colspan="8">100615-c5-2_redo2-2x6_*.nrrd</td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> </table> I dont care about the individual bevel borders between each cell, those are fine. What Im really trying to do is add an additional black line border to certain "walls" within individual cells, similar to the vertical line that separates the 13 and the 9 in the image above... Any suggestions? (Also, how do I eliminate the borders in the cells that contain the file name?) Thanks ahead of time. Similar TutorialsHi I am facing an issue , the table border are overlapping , also its not aligned properly . i am attaching the HTML code , Anyone got the solutions to fix this issue would be a great help. Hey everyone, I have a music video website and on each genre page, I want to build a table to list each band along with a thumbnail image. I know how to do this, however, I can't figure out how to add a cell without completely throwing off the rest of the table. For example, if I alreay have a 3 column table with Aerosmith, Alice Cooper and Chris Isaak in those 3 cells in the first row but I want to add a Beck video (which would need to go between Alice Cooper and Chris Isaak alphabetically), it throws off the cells in that row and in all the other rows of the entire table. I thought about using 1 cell tables for each band but I can't get them to sit next to eachother, they will only stack one on top of the other. Can someone give me some advice or direction? Does that make sense? Hi all, Happy NY Is there anyway to navigate links through tables and cells. I'd like to have some links on my page that change information (text only) within a specific cell or table without changing the page. Is this possible? I remember this being done in frames, but would rather not use frames if possible. Thanks. I have the following code, and it works but I want to change the style of the border, while keeping the border in the center of the page as it is now. Thanks in advance. <html> <body> <table border="1" bordercolor="yellow" align="center"> <tr> <td> </td> </tr> </table> </body> </html> //I want to change border = "1", to something like groove,outset, inset etc. But I want the border to stay only in the center of the page. Is there a way to turn off a portion of a border in a cell of a table. Similar to what you can do in an excel file. I attached a sample of what I am looking to do, of course the image I attached was edited in photoshop to remove the bottom left border of the cell. Just curious if there is any html to turn on and off portions of a cells border. Thanks! I've got tables in my website, which you can view here, if you want. The problem is they look a bit rubbish. They have a 1 pixel border and i'd quite like to take it down to, say, a thin black line rather than those horrible thick white border lines. So how do i do this in html? Thanks. Please take a look at the image I attached to this post. If you look closely, you can tell that the bottom half of the lightbulb, the "Imaginit" title, and the yellow bar to the left of that is all one image file. Above that is a larger image (part of which has the top half of the lightbulb) that spans the whole page. I'm sure you can tell by the break in the lightbulb and the white borders around the image where this question is going... I'm trying to get rid of those breaks. Currently, the large image on top is in its own span tag. Below that everything else is organized in a table structure. I've messed with border-collapse: collapse, tried setting the margins to negative values (of em, px, & pt), set border widths to 0. Nothing gets rid of those spaces. Setting the background color for the cells I think would work, but the problem there is that the bottom-half-lightbulb/Imaginit image's cell is set to colspan=2, rowspan=2. Is it possible to have the image just be "laid" over four individual cells? Just a thought. I'm doing this in Visual Studio 2005/ASP.NET if that helps any. Thanks for anyone's help. I am having a problem with a web page that when I use the echo statement and try to output data to the web page in a table the data in the table pushes the data from another row down the page. What should I do to stop this from happening. I am using adobe dreamweaver. Thanks a lot!! Hello to all, I have been trying to research and track down the solution to a browser consistency issue I'm having. On my page, myaplusservices.com/index.html , I have successfully removed the borders for each frame in Firefox; however, in Internet Explorer the borders are still appearing as thin white lines between each frame. I hope there is some way to correct this so it's consitent between the different browsers. I am new to this and I'm about ready to pull out my hair... =) <!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> <title>A+ Services- Mesa, AZ</title> </head> <frameset cols="*,800,*" frameborder=no border=no framespacing=no frameborder="0"> <frame src="leftblank.html" scrolling=no noresize frameborder=no border=no framespacing=no> <frameset rows="100,30,*,30" frameborder=no border=no framespacing=no> <frame src="banner.html" scrolling=no noresize frameborder=no border=no framespacing=no> <frame src="buttons1.html" scrolling=no noresize frameborder=no border=no framespacing=no> <frameset cols="150,650" frameborder=no border=no framespacing=no> <frame src="navbar.html" scrolling=no noresize frameborder=no border=no framespacing=no> <frame src="home.html" name="main" noresize frameborder=no border=no framespacing=no> </frameset> <frame src="footer.html" scrolling=no noresize frameborder=no border=no framespacing=no> </frameset> <frame src="rightblank.html" frameborder=no border=no framespacing=no> </frameset> </html> I appreciate any help I can get. Thank you, Hi, I have created a table in HTML with some basic attributes. However right now I want each cell to have a thin white line around it, but I do not want a table border. Right now I have the border color set to black so that it will not show up on my site. However I do want the TD cells to each have an individual border. Is this possible? Here is my code... My site has a black background by the way. Code: <html> <body> <table border="2" bordercolor="black" cellspacing="15"> <tr> <td bgcolor="black"><a href="http://1lacrosse.com/images/polldaddy/images/magazine/big/1_Big.jpg" onclick="window.open('http://1lacrosse.com/images/polldaddy/images/magazine/big/1_Big.jpg','popup','width=320,height=420,scrollbars=no,resizable=no,toolbar=no,directories=no,location=no,menubar=no,status=no,left=0,top=0'); return false"><img border="0" src="http://1lacrosse.com/images/polldaddy/images/magazine/small/1_Small.jpg"></a><br><font color="white"><center><b>#1</b></center></font></td> <td bgcolor="black"><a href="http://1lacrosse.com/images/polldaddy/images/magazine/big/2_Big.jpg" onclick="window.open('http://1lacrosse.com/images/polldaddy/images/magazine/big/2_Big.jpg','popup','width=360,height=420,scrollbars=no,resizable=no,toolbar=no,directories=no,location=no,menubar=no,status=no,left=0,top=0'); return false"><img border="0" src="http://1lacrosse.com/images/polldaddy/images/magazine/small/2_Small.jpg"></a><br><br><font color="white"><center><b>#2</b></center></td> <td bgcolor="black"><a href="http://1lacrosse.com/images/polldaddy/images/magazine/big/3_Big.jpg" onclick="window.open('http://1lacrosse.com/images/polldaddy/images/magazine/big/3_Big.jpg','popup','width=320,height=420,scrollbars=no,resizable=no,toolbar=no,directories=no,location=no,menubar=no,status=no,left=0,top=0'); return false"><img border="0" src="http://1lacrosse.com/images/polldaddy/images/magazine/small/3_Small.jpg"></a><br><font color="white"><center><b>#3</b></center></td> <td bgcolor="black"><a href="http://1lacrosse.com/images/polldaddy/images/magazine/big/4_Big.jpg" onclick="window.open('http://1lacrosse.com/images/polldaddy/images/magazine/big/4_Big.jpg','popup','width=370,height=480,scrollbars=no,resizable=no,toolbar=no,directories=no,location=no,menubar=no,status=no,left=0,top=0'); return false"><img border="0" src="http://1lacrosse.com/images/polldaddy/images/magazine/small/4_Small.jpg"></a><br><font color="white"><center><b>#4</b></center></td> </tr> <tr> <td bgcolor="black"><a href="http://1lacrosse.com/images/polldaddy/images/magazine/big/5_Big.jpg" onclick="window.open('http://1lacrosse.com/images/polldaddy/images/magazine/big/5_Big.jpg','popup','width=390,height=460,scrollbars=no,resizable=no,toolbar=no,directories=no,location=no,menubar=no,status=no,left=0,top=0'); return false"><img border="0" src="http://1lacrosse.com/images/polldaddy/images/magazine/small/5_Small.jpg"></a><br><font color="white"><center><b>#5</b></center></td> <td bgcolor="black"><a href="http://1lacrosse.com/images/polldaddy/images/magazine/big/6_Big.jpg" onclick="window.open('http://1lacrosse.com/images/polldaddy/images/magazine/big/6_Big.jpg','popup','width=350,height=420,scrollbars=no,resizable=no,toolbar=no,directories=no,location=no,menubar=no,status=no,left=0,top=0'); return false"><img border="0" src="http://1lacrosse.com/images/polldaddy/images/magazine/small/6_Small.jpg"></a><br><font color="white"><center><b>#6</b></center></td> <td bgcolor="black"><a href="http://1lacrosse.com/images/polldaddy/images/magazine/big/7_Big.jpg" onclick="window.open('http://1lacrosse.com/images/polldaddy/images/magazine/big/7_Big.jpg','popup','width=360,height=420,scrollbars=no,resizable=no,toolbar=no,directories=no,location=no,menubar=no,status=no,left=0,top=0'); return false"><img border="0" src="http://1lacrosse.com/images/polldaddy/images/magazine/small/7_Small.jpg"></a><br><font color="white"><center><b>#7</b></center></td> <td bgcolor="black"><a href="http://1lacrosse.com/images/polldaddy/images/magazine/big/8_Big.jpg" onclick="window.open('http://1lacrosse.com/images/polldaddy/images/magazine/big/8_Big.jpg','popup','width=360,height=430,scrollbars=no,resizable=no,toolbar=no,directories=no,location=no,menubar=no,status=no,left=0,top=0'); return false"><img border="0" src="http://1lacrosse.com/images/polldaddy/images/magazine/small/8_Small.jpg"></a><br><font color="white"><center><b>#8</b></center></td> </tr> </table> </body> </html> By the way I don't want a border around the images because they are different sizes and just wouldn't look that good, instead just with the cells. Thanks so much!! Hi All , In my page, it has two div, one on the left side to do navigation stuff and the right one to display contents of page. How can I create a scroll bar just on the right div so that when it scroll, the div on the left side wont move. REgards Hey everyone! Does anybody know how we could set up google search results for this: ( see pic ) Hi, I run an online music website, http://obscurealbums.com At the end of my last post, I decided to put some buttons with links to Amazon US and UK stores, and everything works fine. However, if you click on the post's title (so clicking on the individual post) the images are replaced by the alt text and the Amazon US is strikethrough. How can I get around this? If you need any more details, please let me know - I'm an HTML novice... Thanks for your time. i just started learning html today. and trying to get cell alignments figured out. I know in word, and other programs you can align text in 9 different spots in a cell. Top left, top center, top right middle left, middle center, middle right bottom left, bottom, center, bottom right but while im trying to use align="center" or using valign="middle" i cant get the text to align to the center of a cell only using align i can move across the top of the cell and using valign i can move across the left of the cell is there a way to use both together to get to the other portions of the cell ? Hi, I have been challenged with creating the HTML for a news article list which is going on a website. I have started out by creating a test list using <ul><li> tags This is what the list looks like http://design2rent.co.uk/menu_test/index.html The data for this list will be grabbed from a database but the designer would like to have the date aligned to the right instead of at the end of the article, i have uploaded an image here for what the end result should look like. ignoring the backgroudn images ect as this is just a snippent of the design is it possible to have 1 list item split into 2 cells and align one of them to the left and the other to the right to acheive the end result layout? I've racked my brains with divs and tables but can't seem to find a solution and tried many google searches but not found any relevent topics. any help would be hugely appreciated When you have a table, and there is a lot of text in cells and you dont want the ENTIRE table stretch, what code can you add to the cell in order to give it scrollbars? The only way I found online is by css, but I'm not sure where to add the code. Any tips/help? Hi, here's my code, and things are working as they should. My only problem is I can't seem to move my drop-down list from the cell it is in to the cell left one. (see photo) Can anyone see from my code whats going wrong? Site url: http://www.walthamforest-fc.co.uk/st...layer.php?id=3 Code: <TABLE WIDTH="520" ALIGN=center BORDER=0 CELLSPACING=0 CELLPADDING=0> <TR VALIGN=middle ALIGN=center> <td><img src="http://www.walthamforest-fc.co.uk/stats/images/playerbar.jpg"></TD> </TR> <tr VALIGN=left ALIGN=center> <td><img src=" <?php echo $image_url = "images/" . $playerdata['id'] . "_1.jpg"; ?>"/><img src=" <?php echo $image_url = "images/" . $playerdata['id'] . ".jpg"; ?>"/> </td></tr> <tr> <td background="/stats/images/playernameback.jpg" width="308" height="46"> <font face="Arial" size="4"><span style="letter-spacing: 0pt"><font color="#018609"> <?php echo "$playerdata[firstname]" ?> <?php echo "$playerdata[lastname]" ?> </TD> <td> <td background="/stats/images/playernameback.jpg" width="202" height="46"><?php // //Haetaan kaikki pelaajat dropdownia varten // $sql = ' SELECT P.PlayerID AS id, P.PlayerLastName AS lastname, P.PlayerFirstName AS firstname, P.PlayerPublish AS publish FROM tplss_seasons S LEFT OUTER JOIN tplss_players P ON P.PlayerID = S.SeasonPlayerID '; if($defaultseasonid == 0) { $sql .= " WHERE P.PlayerID != '' AND P.PlayerPublish = '1' GROUP BY id ORDER BY firstname, lastname"; } else { $sql .= " AND S.SeasonID = '$defaultseasonid' WHERE P.PlayerID != '' AND P.PlayerPublish = '1' GROUP BY id ORDER BY firstname, lastname"; } $query = mysql_query("$sql", $connection) or die(mysql_error()); echo"<select name=\"playerid\">"; while($data = mysql_fetch_array($query)) { if($data['id'] == $id) { echo"<option value=\"$data[id]\" SELECTED>$data[firstname] $data[lastname]</option>\n"; } else { echo"<option value=\"$data[id]\">$data[firstname] $data[lastname]</option>\n"; } } echo"</select> <input type=\"submit\" name=\"change_player\" value=\"$txt_change\">"; mysql_free_result($query); $ttl = (($_SESSION['getAdditional'] + 1) % 2) ? "Show": "Hide"; ?> </td> </tr> Hi: I have a long table (613 rows) with two columns (Containing Names, Addresses, Lot Numbers, and Phone Numbers, etc. I would like to format the cells of each column so that certtain fields (e.g., Phone Number is in a certain position in each cell). For example, I'd like this phone number to be right-aligned in the second row of each cell, etc Is there a standard, or easy way to do this ?? Thank for any help offered. -Mel Smith |