|
HTML - Problems With Table Cell Alignment
Hi
I know I'm probably committing a cardinal sin by using a table for this layout but that's what I've done. For some reason which I cannot determine the second column is not aligned with the first column in Chrome 11 and Firefox 3.6 but on IE it works correctly. http://wwwrobe.www39.a2hosting.com/?page_id=4 Any help would be greatly appreciated. Many thanks Similar TutorialsHi everyone: Any help appreciated. Objective: To have three equally sized and spaced images arranged horizontally, with their size set automatically by the size of the window. Development: I'm using a Mac, and I don't have ready access to a PC to experiment. What I tried: Code: <table> <tr> <td><img src = "a.png" style = "width: 100%" /></td> <td><img src = "b.png" style = "width: 100%" /></td> <td><img src = "c.png" style = "width: 100%" /></td> </tr> </table> <p class = "caption">A caption for the 3 images</p> <p class = "legend" >A legend for the three images</p> What happened: This works perfectly in Safari and Firefox (Mac) and Firefox under Vista, but in Internet Explorer under Vista , the images are HUGE - the unscaled size of the originals. What I think is the reason: IE is taking 100% to be relative to the width of the body element, not the td element. What I don't want to have to do: Use fixed sizes or calculate the sizes on the fly. What I'm trying now: removing the table and using a div, and inside that, setting the image width to 33% and floating one right and one left. What's the trick to get around this IE "gotcha" please? Thanks from a newbie. hi, i have a jsp page, in this page i am displaying data retrieved from mysql database. Now the problem is i must color table cell based on cell value. how to implement this.please give me an sample or working code foe this problem.( any code is accepted) preferably html or javascript. i.e if cell value is "late" then display that cell in red color else display the cell in green color please help me. Thanks ad Regards Akash The table itself is working fine, but the size of each cell is not correct in Firefox. Here is a screenshot of what is happening: http://img35.imageshack.us/img35/1938/tabletroubles.gif Here is the head of my page, the css for the table is he HTML Code:
<style type="text/css">
#cat table {border:0px solid #333333; cell-padding:0; cell-spacing:0; align=center}
#cat tr {align=center}
#cat td {font-size: 13px; font-family=tahoma; font-weight: bold; padding: 0px; border:0px solid #333333; align=center;}
#cat td a {text-decoration: none; color:#757575; background-color: white; display:block; height=23; background-image: url(linkbg1.gif); align=center;}
#cat td a:hover {background-color: #333333; font-weight: bold; text-decoration: none;color: #ffffff; background-image: url(linkbg2.gif); align=center;}
</style>
and here is the table code, located in the body of the page: HTML Code: <div style="Height:53px; overflow:auto; width:900px; position:absolute; top:0; left:0"> <TABLE bgcolor=#333333 cellspacing=0; cellpadding=0;><tr><td> <div id="cat"> <table width=900; cellpadding:0px; cellspacing:0px> <tr align=center> <td width=20%> <font face=tahoma><a href="home.html">Home</a></font> </td> <td width=20%><center><font face=tahoma><a href="openings.html" target="_top">Openings</a></font></center></td> <td width=20%><center><font face=tahoma><a href="dance.html" target="_top">Dance</a></font></center></td> <td width=20%><center><font face=tahoma><a href="projects.html" target="_top">Projects</a></font></center></td> <td width=20%><center><font face=tahoma><a href="vocaloid.html" target="_top">Vocaloid</a></font></center></td> </tr> <tr> <td width=20%><center><font face=tahoma><a href="fanflashes.html" target="_top">Fanflashes</a></font></center></td> <td width=20%><center><font face=tahoma><a href="caramelldansen.html" target="_top">Caramelldansen</a></font></center></td> <td width=20%><center><font face=tahoma><a href="cosplay.html" target="_top">Cosplay</a></font></center></td> <td width=20%><center><font face=tahoma><a href="endings.html" target="_top">Endings</a></center></td> <td width=20%><center><font face=tahoma><a href="anime.html" target="_top">Anime Episodes</a></font></font></center></td> </tr> </table> </div> </td></tr></table> </div> A table is nested within another table. The table on the outside has no content, it is there to make a gray border around everything else. If you look at the table in firefox & internet explorer, you'll see that in IE- the table is much thicker than in firefox. How can i make it so that the table in Firefox will have the same thickness as the one in IE? I could really use some help. Thanks! Hello, I am very new to HTML, so I could use any help I can get right now. I am making a website for a project in my computer class and I am having issues with my pictures and cells. In Firefox my pictures show up but my text gets cut off at the bottom of the cell...(I didn't want to mess with frames this time because they confuse me, that's why I used a table instead). In IE6 the pictures don't show up but all of the text is shown in the cell...here is a link to my 'homepage' if you want to see what I am talking about...or if anyone wants to give me advice. icarus.uic.edu/~speter20/areorg/index.html Also, my professor wanted one of our pages to be of "bad style," which is why the first page you see is so bad. Just wanted to let you know that. ANY help at all is GREATLY appreciated!!! Thanks, Stephanie On my website I have a left and a right menu, both columns have 3 cells with height set to 100% or just default no value. It all works fine in firefox and opera. However in Internet Explorer the bottom cell in both columns don't extend to meet the bottom of material in the cell above. It helps if you turn borders on in the code, but the betfred banner and mailing list items are valigned top, so should meet the bottom of the menu above in the cell above. Can anyone offer any help thanks hello i have found a solution. thanks anyway! Hi guys, I've created an advert with some affiliate links in that I want to display on my main pages of my website. I have only fairly recently jumped into the world of web design/development so I've probably not made the most efficient page. The advert is layed out inside a table that is 4 columns and 2 rows and everything seems fine when I view that page. Except, when I put this page into my main pages (via an iframe) it shows nearly correctly, but the alignment is slightly off: the second column in is a few pixels down than the others. I have checked the coding over and over to no avail. Is there maybe a reason for this? Or some tips that you could give? I did try yesterday by just copying and pasting the code directly from the advert page to the main pages which require them - but that's a whole new can of worms! The alignment of that attempt was beyond a joke (even then I couldn't work it out...). Many thanks in advance for your ideas. Hi everyone, I'm working on a website for a family member who has a buisness doing antique restoration, I'm trying to make all the pages have the same alignment, the address is http://www.maxbarr.com/ if you click on the buttons along the top you'll see what i mean, some of them are the same alignment others are shifted slightly to the left, they all have exactly the same code as I've used a Dreamweaver template. However they do use stylesheets as well, with the gallery pages using two so I'm guessing it may be that. For bonus marks can someone tell me how to make the copyright information in the gallery section the same size as one the other pages. here is the code for the template: 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>.:Max Barr Antique Furniture Restoration:.</title>
<style type="text/css" media="all">
<!--
@import url("../styles.css");
#header #logo a {
font-family: Times New Roman, Times, serif;
}
#index #outerWrapper #gradient #contentWrapper br {
color: #FFF;
}
#index #outerWrapper #gradient div {
color: #FFF;
}
-->
</style>
<!-- TemplateBeginEditable name="gallery info" --><!-- TemplateEndEditable -->
<!--[if IE 5]>
<style type="text/css">
#outerWrapper #contentWrapper #leftColumn1 {
width: 200px;
}
</style>
<![endif]-->
<!--[if IE]>
<style type="text/css">
#outerWrapper #contentWrapper #content {
zoom: 1;
}
</style>
<![endif]-->
</head>
<body id="index">
<div id="header">
<div id="logo">
<a href="index.html" onmouseover=""> Max Barr Antique Restoration</a></div>
</div>
<div id="outerWrapper">
<div id="gradient">
<div id="nav" style="margin-bottom: 10px;">
<div align="center">
<ul>
<li><a href="index.html">Home</a></li>
<li><a href="profile.html">Profile</a></li>
<li><a href="restoration.html">Restoration</a></li>
<li><a href="gallery.html">Gallery</a></li>
<li><a href="contact.html">Contact</a></li>
</ul>
</div>
</div>
<div id="contentWrapper">
<div align="center"></div>
<div id="content"> <!-- TemplateBeginEditable name="Content" -->
<h1>This is the page title</h1>
<h2>This is the H2 tag</h2>
<!-- TemplateEndEditable --></div>
</div>
<div id="credit" align="center">Copyright © 2009 Max Barr
<br />
</div>
</div>
</div>
</body>
</html>
And here's the code for the stylesheet: Code: html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6 {
margin: 0;
padding: 0;
border: 0;
outline: 0;
font-size: 100%;
}
img {
border-style: none;
}
body {
background-color: #000000;
color: #333333;
font-family: Arial, Helvetica, sans-serif;
font-size: 11px;
line-height: 14px;
margin: 0 0 0 0;
padding: 0 0 0 0;
text-align: center;
background-image: url(images/body-bg.png);
background-repeat: repeat-x;
background-position: top;
}
h1 {
color: #FFFFFF;
font-size: 24px;
font-weight: normal;
line-height: 28px;
letter-spacing: -1px;
}
h2 {
color: #999999;
font-size: 18px;
font-weight: bold;
line-height: 20px;
}
a, a:link {
color: #CCCCCC;
font-weight: bold;
text-decoration: none;
}
a:visited {
color: #CCCCCC;
font-weight: bold;
text-decoration: none;
}
a:hover {
color: #FFFFFF;
text-decoration: bold;
}
a:focus {
color: #CCCCCC;
}
a:active {
color: #CCCCCC;
}
#outerWrapper {
margin: 0 auto 0px;
text-align: left;
width: 920px;
background: #fff url(images/content-bg.png) repeat-y left 13px;
}
#outerWrapper #gradient {
background-image: url(images/gradient-shadow.png);
background-repeat: no-repeat;
background-position: center top;
}
#header {
height: 80px;
background-image: url(images/header-bg.jpg);
background-repeat: no-repeat;
background-position: bottom;
width: 900px;
margin-right: auto;
margin-left: auto;
text-align: left;
padding-left: 20px;
}
#header #logo {
color: #FFF;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 28px;
font-weight: normal;
padding-top: 10px;
padding-left: 0px;
line-height: 50px;
float: left;
width: 1000px;
text-decoration: none;
}
#header #links{
color: #C06A05;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
font-weight: normal;
float: right;
width: 370px;
text-align: right;
margin-top: 25px;
padding-right: 25px;
}
#links a, #links a:active, #links a:visited {
font-weight: normal;
color: #C06A05;
}
#header #links a:hover {
color: #CCCCCC;
text-decoration: none;
}
#nav {
height: 62px;
margin-right: 20px;
margin-left: 20px;
color: #FFFFFF;
background-color: #CCCCCC;
background-image: url(images/nav-bg.jpg);
background-repeat: repeat-x;
background-position: top;
padding-top: 0;
padding-right: 0px;
padding-bottom: 0;
padding-left: 0px;
border-right-width: 1px;
border-left-width: 1px;
border-right-style: solid;
border-left-style: solid;
border-right-color: #000000;
border-left-color: #000000;
margin-bottom: 0px;
}
#nav ul {
margin: 0px;
padding: 0px;
}
#nav ul li {
margin: 0px;
display: block;
float: left;
list-style: none;
clear: right;
}
#nav ul li a {
display: block;
padding-right: 20px;
padding-left: 20px;
text-align: center;
color: #CCCCCC;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
line-height: 62px;
font-weight: normal;
background-image: url(images/nav-border.jpg);
background-repeat: no-repeat;
background-position: right top;
}
#nav ul li a:hover {
background: url(images/nav-hover.jpg) repeat-x top;
text-decoration: none;
color: #FFFFFF;
}
#nav ul li#active {
background: url(images/nav-hover.jpg) repeat-x top;
text-decoration: none;
}
#nav ul li#active a {
color: #FFFFFF;
}
.subpage-navimage {
float: right;
}
#spacer {
background-image: url(images/nav-spacer.png);
background-repeat: no-repeat;
background-position: center top;
height: 27px;
}
#outerWrapper #feature {
height: 230px;
width: 880px;
margin-left: 20px;
margin-bottom: 5px;
background-image: url(images/feature.jpg);
background-repeat: no-repeat;
background-position: center top;
}
#outerWrapper #contentWrapper {
padding-right: 25px;
padding-left: 30px;
clear: both;
padding-top: 10px;
}
#outerWrapper #contentWrapper #leftColumn1 {
float: left;
padding: 0px;
width: 200px;
background-color: #232323;
border: 1px solid #161616;
}
#outerWrapper #contentWrapper #content {
margin-top: 0px;
margin-right: 5px;
margin-bottom: 0px;
margin-left: 0px;
padding-top: 10px;
padding-right: 15px;
padding-bottom: 15px;
padding-left: 15px;
background-color: #3E3E3E;
color: #CCCCCC;
border: 1px solid #2C2C2C;
font-size: 12px;
line-height: 18px;
}
#content-image {
margin-bottom: 15px;
}
#content ul li {
margin-bottom: 5px;
}
#outerWrapper #footer {
background: url(images/footer-bg.png) no-repeat left top;
height: 60px;
color: #666666;
text-align: center;
padding-top: 25px;
padding-right: 30px;
padding-bottom: 0px;
padding-left: 30px;
}
#leftColumnContent {
width: 190px;
padding-top: 0px;
padding-right: 0px;
padding-bottom: 0px;
padding-left: 0px;
color: #999999;
margin-right: 5px;
margin-left: 5px;
margin-top: 5px;
margin-bottom: 5px;
}
#leftColumnContent h3 {
border: 1px solid #000000;
padding-top: 5px;
padding-bottom: 6px;
font-size: 12px;
padding-right: 4px;
padding-left: 4px;
background-image: url(images/sidebar-h3-bg.jpg);
background-repeat: repeat-x;
background-position: top;
color: #CCCCCC;
}
#leftColumn1 ul {
margin: 0px;
padding-top: 10px;
padding-right: 0px;
padding-bottom: 10px;
padding-left: 0px;
}
#leftColumn1 ul li {
list-style: none;
display: inline;
}#leftColumn1 ul li a {
display: block;
padding: 4px 4px 4px 6px;
color: #999999;
}
#leftColumn1 ul li a:hover {
text-decoration: none;
background-color: #171717;
color: #CCCCCC;
}
.fltlft {
float: left;
margin-right: 10px;
margin-bottom: 10px;
}
.fltrt {
float: right;
margin-left: 10px;
margin-bottom: 10px;
}
.sidebarlt {
padding: 6px;
border: 1px solid #000000;
background-color: #4E4E4E;
color: #CCCCCC;
}
.sidebardk {
color: #999999;
border: 1px solid #4A4A4A;
padding: 6px;
background-color: #1F1F1F;
}
.sidebardk a, .sidebardk a:hover, .sidebardk a:visited, sidebardk a:active {
color: #999999;
}
}
#credit {
text-align: center;
padding-top: 0px;
padding-bottom: 8px;
font-size: 11px;
color: #333333;
width: 920px;
margin-right: auto;
margin-left: auto;
}
#credit a, #credit a:hover, #credit a:visited, #credit a:active, #credit a:focus {
color: #333333;
font-weight: normal;
}
#index #outerWrapper #gradient p {
color: #FFF;
}
#index #outerWrapper #gradient div {
color: #FFF;
}
btw I know the code is very messy, I'm trying to learn more so I can clean it up a bit Thanks very much Hello ladies and gentlemen. Im having trouble aligning some buttons i made with an a big image and small image of the like. They need to look like this... http://i217.photobucket.com/albums/c...wayne/main.jpg but currently are out of sync and all stuffed up. I was wondering what i could do to correct he problem and make it like the image above. Thanks in advance Hi guys, I have two problems with my site http://www.djash.com Both problems have to do with charts section. 1. The font size for the charts shows bigger in firefox and chrome - it shows correctly on IE as intended. 2. I need to decrease the gap between the "Mainstream House" Charts and the "RnB" charts but I haven't been able to find a way to do it. thanks a lot in advance for anyone who can help with these 2 issues Andreas Hi I'm having problems with the following set of code:- Code: <style> #columns { width: 600px; } #columns .column { position: relative; width: 46%; padding: 1%; border: solid 0px #000; } #columns .left { float: left; } #columns .right { float: right; }</style><div id="columns"> <div class="left column"> <p><b>What are your journey needs?</b></p><input type="checkbox" name="Journey Needs" value="Elderly">Elderly<br>
<input type="checkbox" name="Journey Needs" value="Wheelchair User">Wheelchair User<br>
<input type="checkbox" name="Journey Needs" value="Mobility Impaired">Mobility Impaired<br>
<input type="checkbox" name="Journey Needs" value="Unable to use own/public transport">Unable to use own or public transport<br>
<input type="checkbox" name="Journey Needs" value="No public transport available">No Public Transport available<br>
<input type="checkbox" name="Journey Needs" value="Group Hire - General Public">Group Hire - General Public<br>
<input type="checkbox" name="Journey Needs" value="Group Hire - Community Groups">Group Hire - Community Groups<br>
<input type="checkbox" name="Journey Needs" value="Youth">Youth<br>
</p>
</p> </div> <div class="right column"> <p><b>What is your journey purpose?<b></p><input type="Radio" name="Journey Type" value="Shopping">Shopping<br>
<input type="Radio" name="Journey Type" value="Hospital Appointment">Hospital Appointment<br>
<input type="Radio" name="Journey Type" value="G.P., Optician, Chiropodists, Physio,etc">G.P., Optician, Chiropodists, Physio. etc<br>
<input type="Radio" name="Journey Type" value="Day Care">Day Care<br>
<input type="Radio" name="Journey Type" value="Leisure">Leisure<br>
<input type="Radio" name="Journey Type" value="Education">Education<br>
<input type="Radio" name="Journey Type" value="Visiting (Hospital, etc)">Visiting (Hospital, etc)<br>
<input type="Radio" name="Journey Type" value="Other">Other<br>
<p>
</div></div></p>
<b>Please give more details:</b><br>
<textarea name="VisitorComment" maxlength="300" lengthcut="true" rows="6" cols="50">
</textarea><br><br>
I use two different browsers, IE7 (Version 7.0.5730.13CO) and Google Chrome (Version 12.0.742.142). Even though a simple solution would be to not use any column coding at all, thereby putting them one above the other, this makes the page too long so I am trying to get them side by side. The problem is that the page looks about perfect in IE but in Chrome the wording 'Please give more details' appears at the right-hand edge of the text area, unless you alter the page zoom in which case it appears above the radio functions. I've tried tagging as a table but the situation is then reversed: looks great in Chrome but in IE the check boxes are almost perfectly displayed and the radio functions are squashed. I'm not too familiar with tables or columns at this point. The table tags I hijacked from the Links page ( I was able to understand them enough to both remove and add new ldata to the table) on the site I'm helping develop and the column tags I gleaned from a html tutorial site. Is this just as issue with the way that different browsers display html or am I missing something in the tags? Thanks for looking and hope someone can help. New to the forum, but the title states it all. I'm trying to help someone find a fix for his website, when people use Internet Explorer 6 or 7 to view the site, it looks like this: http://img707.imageshack.us/img707/7493/badq.jpg Here is the link to the page he's having trouble with: http://biglake411.com/ When viewed in FF or IE8 it views fine. While just having everyone update to Internet Explorer 8 or FF would be the easiest thing, some people are viewing/using the website from work computers and cannot update. I think he used some kind of automatic generator to create the code. If you could help diagnose the problem it'd be much appreciated... Feel free to email me the fix or post it on here. Much appreciated everyone! Hi everyone. So I got my template set up to the way I like it and everything is rolling good. I inserted a picture into one of the cells in the table and it shifts everything over. Here is my code: <td width="625" colspan="1" bgcolor="white"> <font type="Arial" size ="5" color="blue"> <b>Floorplan</b><br> <center> <a href="floorplanlarge.jpg"><img src="floorplansmall.jpg" border="0" /></a> </center> </td> I have been working on fixing this for the last hour and am out of ideas on what is going on. The picture is smaller than the cell width range. My picture width is 311 pixels and the cell width is 625 pixels. I dont know if there is code whether its HTML or CSS to prevent the cell from widening. Any help would be appreciated. Also if you need me to provide more detail I can. Thanks. On the website: www.jsbseafoods.20m.com Have the following problems: Browser Issues: 1.) When viewed with Microsoft Internet Explorer it is aligned to the left instead of centred, top of the company name is missing, company jpg and gif images missing? 2.) When viewed with Firefox company name is missing? 3.) When viewed with Chrome sometimes when you scroll down the page and then up, top part of the company name is missing? Other Issues2: *SOLVED* 4.) On the Homepage "/div>" appears at the bottom of the page, I cant find where this is in the html code to remove? *SOLVED* 5.) On the Location page in Firefox and Chrome the page has an un-necessary space below the google map, on Internet Explorer the page is cut short. It would be greatly appreciated if you could help with these issues, I have been looking through the html and css code and cant find the problems. Thanks James Hi Can someone please tell me how I can make a table cell (which contains text which is linked) linkable? http://www.revolution.worldclanleagu...?site=calendar Here you can see a calendar with months at the top. When you hover over a month, the cell highlights but only the text inside is actually selectable - I'd like to make the cell selectable/linked. PHP/HTML I have: Code: <td class="calendar-month" align="center"><a class="calendar" href="index.php?site=calendar&month=01">'.mb_substr($_language->module['jan'], 0, 3).'</a></td> CSS: Code: a.calendar, a.calendar:visited, a.calendar:active {
font-family: Arial;
color: #dbdbdb;
font-size: 11px;
line-height: 13px;
text-decoration: none;}
a.calendar:hover {
font-family: Arial;
color: #dbdbdb;
font-size: 11px;
line-height: 13px;
text-decoration: none;}
.calendar-month, calendar-month:visited {
font-family: Arial;
color: #dbdbdb;
font-size: 11px;
line-height: 13px;
padding: 5px;
background-color: #2f2f2f;
border-bottom:3px solid #1d1d1d;
border-right: 1px solid #000;
border-top: 1px solid #424242;
border-left: 1px solid #424242;}
.calendar-month:active {
font-family: Arial;
color: #dbdbdb;
font-size: 11px;
line-height: 13px;
padding: 5px;
background-color: #2f2f2f;
border-bottom:3px solid #1d1d1d;
border-right: 1px solid #000;
border-top: 1px solid #424242;
border-left: 1px solid #424242;}
.calendar-month:hover {
font-family: Arial;
color: #dbdbdb;
font-size: 11px;
line-height: 13px;
padding: 5px;
background-color: #3f3f3f;
border-bottom:3px solid #1d1d1d;
border-right: 1px solid #000;
border-top: 1px solid #424242;
border-left: 1px solid #424242;}
(sorry theres so much css) Thanks in advance =D Hello, I have a problem with tables cells containing form buttons: Code: <tr> <td colspan="2" align="center"> <button id="button-submit_2" type="submit">Add Name</button>      </form> <form action="nrt-home-edit&delete.php" method="post"> <input type="hidden" name="class_name" value="$class_name[0]"/> <button id="button-submit_2" type="submit">Finish</button></form> </td> </tr> The above code puts the two buttons on their own lines within the table cell. My question is, does anybody know how to keep them on the same line without putting them into their own individual cells? I have (for my sins - should have read up on css earlier) a table-based site, essentially with header, footer, left and right cells and the main piece in the middle. I have used different background colours, but am wanting to highlight the middle bit. I have used a border, but that seems to centre on the edge of the cell - ie half the specified border size is inside the cell and half outside. The effect of this is that my two side pieces have whitespace before they start. Is there any way to specify a 'border' which stays totally within its relevant cell ? Thanks. Hi, I have a template made that my friend made in photoshop and slice the image to be able to put them in html. The problem is when I put too much text the cell on both side of the middle one are resizing too. is there a way to lock them from resizing and get only the cell that i want to resize? I'll put the html code here and thx a lot! BTW When it say: this cell resize verticaly - it mean that I want this cell to resize and not the others 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>
<title>web_DIV</title>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
</head>
<body bgcolor="#000000">
<table id="tableau_01" width="100%" border="0" cellpadding="0" cellspacing="0">
<tr>
<td rowspan="4" width="50%" height="316" background="images/web_div_01.jpg">
</td>
<td colspan="6" width="992" height="61" background="images/web_div_02.jpg">
</td>
<td rowspan="4" width="50%" height="316" background="images/web_div_03.jpg">
</td>
<td>
<img src="images/spacer.gif" width="1" height="61" alt="" /></td>
</tr>
<tr>
<td rowspan="3" width="55" height="255" background="images/web_div_04.jpg">
</td>
<td rowspan="3" width="23" height="255" background="images/web_div_05.jpg">
</td>
<td width="772" height="26" background="images/web_div_06.jpg">
</td>
<td colspan="2" rowspan="3" width="21" height="255" background="images/web_div_07.jpg">
</td>
<td width="121" height="26" background="images/web_div_08.jpg">
></td>
<td>
<img src="images/spacer.gif" width="1" height="26" alt="" /></td>
</tr>
<tr>
<td rowspan="4" width="772" height="435" background="images/web_div_09.jpg">
the text </td>
<td width="121" height="4" background="images/web_div_10.jpg">
</td>
<td>
<img src="images/spacer.gif" width="1" height="4" alt="" /></td>
</tr>
<tr>
<td width="121" height="225" background="images/web_div_11.jpg">
</td>
<td>
<img src="images/spacer.gif" width="1" height="225" alt="" /></td>
</tr>
<tr>
<td width="50%" height="100%" background="images/web_div_12.jpg">
<p>this cell resize verticaly</p>
</td>
<td colspan="2" width="78" height="100%" background="images/web_div_13.jpg">
this cell resize verticaly</td>
<td colspan="3" width="142" height="7" background="images/web_div_14.jpg">
this cell resize verticaly</td>
<td width="50%" height="100%" background="images/web_div_15.jpg">
this cell resizeverticaly</td>
<td>
<img src="images/spacer.gif" width="1" height="7" alt="" /></td>
</tr>
<tr>
<td rowspan="5" width="50%" height="345" background="images/web_div_16.jpg">
</td>
<td colspan="2" rowspan="2" width="78" height="223" background="images/web_div_17.jpg">
</td>
<td colspan="2" rowspan="2" width="21" height="223" background="images/web_div_18.jpg">
</td>
<td rowspan="4" width="121" height="332" background="images/web_div_19.jpg">
</td>
<td rowspan="5" width="8" height="345" background="images/web_div_20.jpg">
</td>
<td>
<img src="images/spacer.gif" width="1" height="199" alt="" /></td>
</tr>
<tr>
<td width="772" height="24" background="images/web_div_21.jpg">
</td>
<td>
<img src="images/spacer.gif" width="1" height="24" alt="" /></td>
</tr>
<tr>
<td colspan="5" width="871" height="81" background="images/web_div_22.jpg">
</td>
<td>
<img src="images/spacer.gif" width="1" height="81" alt="" /></td>
</tr>
<tr>
<td colspan="2" width="78" height="28" background="images/web_div_23.jpg">
</td>
<td colspan="2" width="773" height="28" background="images/web_div_24.jpg">
</td>
<td width="20" height="28" background="images/web_div_25.jpg">
</td>
<td>
<img src="images/spacer.gif" width="1" height="28" alt="" /></td>
</tr>
<tr>
<td colspan="6" width="992" height="13" background="images/web_div_26.jpg">
</td>
<td>
<img src="images/spacer.gif" width="1" height="13" alt="" /></td>
</tr>
<tr>
<td>
<img src="images/spacer.gif" width="8" height="1" alt="" /></td>
<td>
<img src="images/spacer.gif" width="55" height="1" alt="" /></td>
<td>
<img src="images/spacer.gif" width="23" height="1" alt="" /></td>
<td>
<img src="images/spacer.gif" width="772" height="1" alt="" /></td>
<td>
<img src="images/spacer.gif" width="1" height="1" alt="" /></td>
<td>
<img src="images/spacer.gif" width="20" height="1" alt="" /></td>
<td>
<img src="images/spacer.gif" width="121" height="1" alt="" /></td>
<td>
<img src="images/spacer.gif" width="8" height="1" alt="" /></td>
<td></td>
</tr>
</table>
</html>
|
|||||||