Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Register Log in
  • Congratulations strongm on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

vertical cell problem

Status
Not open for further replies.
MCasey

MCasey

Technical User
May 30, 2006
21
US
I'm having a terrible time trying to figure out why one of my cells (the one with the "welcome to Client" head is shifting so far down. It should be about 30 pixels below the squiggle lines. I'm setting up a site with tables instead of framesets for the first time and can't figure out what is wrong with my code (generated by DW). Plus...it looks ok on my mac, but not a pc. UGH!

Can anyone help? Here is the code:



<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Client Name</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script language="JavaScript" type="text/JavaScript">
<!--



<!--


<!--

<!--
function MM_reloadPage(init) { //reloads the window if Nav4 resized
if (init==true) with (navigator) {if ((appName=="Netscape")&&(parseInt(appVersion)==4)) {
document.MM_pgW=innerWidth; document.MM_pgH=innerHeight; onresize=MM_reloadPage; }}
else if (innerWidth!=document.MM_pgW || innerHeight!=document.MM_pgH) location.reload();
}
MM_reloadPage(true);
//-->
</script>
<link href="site/pwrstyle2.css" rel="stylesheet" type="text/css">
</head>

<body link="#3366CC" vlink="#3366CC">
<table border="1" align="center" cellpadding="0" cellspacing="0">
<tr>
<td bgcolor="#CCCCCC"><table border="0" cellpadding="0" cellspacing="0" bgcolor="#FFFFFF">
<tr>
<td width="175" height="257" colspan="2" rowspan="2" valign="top" bgcolor="#FFFFFF"><img src="site/assets/pwr_logol.jpg" width="175" height="231"></td>
<td width="561" height="112" colspan="2" valign="top" bgcolor="#FFFFFF"><img src="site/assets/pwr_logor.jpg" width="561" height="112"></td>
</tr>
<tr>
<td width="35" height="358" rowspan="2" valign="top">&nbsp;</td>
<td width="526" height="358" rowspan="2" valign="top"><table width="526" height="350" border="0" cellpadding="0" cellspacing="0" mm_noconvert="TRUE">
<tr>
<td colspan="2" align="left" valign="top"><img name="indexhead" src="site/assets/indexhead2.gif" width="298" height="60" border="0" alt="">
</td>
</tr>
<tr>
<td colspan="2" class="bodyindent"><p>Lorem ipsum dolor sit amet,
consectetuer adipiscing elit. Nunc urna. Mauris condimentum enim
at erat. Vestibulum nibh. Cras sollicitudin sem id augue. Nulla
neque. Fusce convallis pharetra ligula. Nam laoreet dui at libero.
Fusce egestas justo lobortis felis. Cras dui mauris, porta vitae,
ullamcorper sit amet, fringilla eget, erat. Morbi sed risus vel
nulla tincidunt varius.
<p>Cras diam arcu, elementum nec, pulvinar
et, aliquet gravida, urna. Nam laoreet lobortis ligula. Ut
sem nisi, venenatis ac, fringilla quis, congue a, purus. Nullam
viverra
condimentum nulla. Nunc ut turpis sed odio scelerisque semper.
<p>Integer metus pede, iaculis eget, sagittis in, semper id,
magna. Donec gravida. Donec turpis. Ut vestibulum, dui quis
sollicitudin
vehicula, sem elit consectetuer nulla, vel viverra justo
nibh sit amet ipsum. Nam rhoncus.
Mauris eget nibh. Quisque risus. Etiam consequat, mauris
a molestie
ultrices, velit turpis porta neque,
</td>
</tr>
<tr>
<td width="54%" valign="top" class="body"><p> a faucibus nisl lacus
at sapien. Aliquam id nulla. Pellentesque id dolor non magna
tempor vehicula. Vestibulum ante ipsum primis in faucibus orci
luctus et ultrices posuere cubilia Curae; Nullam egestas, elit
sed tristique condimentum, justo augue pharetra augue, vitae
cursus massa dui a orci. Sed feugiat. Morbi rutrum hendrerit
nisi. </p>
</td>
<td width="46%" align="right" valign="top"><img name="preferemail2" src="site/assets/circles/testcircle.jpg" width="220" height="192" border="0" alt=""></td>
</tr>
</table></td>
</tr>
<tr>
<td width="22" height="213" valign="top">&nbsp;</td>
<td width="153" height="213" valign="top" bgcolor="#FFFFFF"><table width="142" border="0" cellpadding="4" cellspacing="0" mm_noconvert="TRUE">
<tr>
<td colspan="2"><img src="site/assets/spacer.gif" width="20" height="15"></td>
</tr>
<tr valign="top">
<td width="11%" class="leftnav"><div align="center"><img name="diamond" src="site/assets/diamond.gif" width="10" height="10" border="0" alt=""></div>
</td>
<td width="89%"><a class="topnavlink" href="linktocome">LINK 1</a></td>
</tr>
<tr valign="top">
<td class="leftnav"><div align="center"><img name="diamond" src="site/assets/diamond.gif" width="10" height="10" border="0" alt=""></div>
</td>
<td><a class="topnavlink" href="linktocome">LINK 2</a></td>
</tr>
<tr valign="top">
<td class="leftnav"><div align="center"><img name="diamond" src="site/assets/diamond.gif" width="10" height="10" border="0" alt=""></div>
</td>
<td><a class="topnavlink" href="linktocome">LINK 3</a></td>
</tr>
<tr valign="top">
<td class="leftnav"><div align="center"><img name="diamond" src="site/assets/diamond.gif" width="10" height="10" border="0" alt=""></div>
</td>
<td><a class="topnavlink" href="linktocome">LINK 4</a></td>
</tr>
<tr valign="top">
<td><div align="center"><img name="diamond" src="site/assets/diamond.gif" width="10" height="10" border="0" alt=""></div>
</td>
<td><a class="topnavlink" href="linktocome">LINK 5</a></td>
</tr>
<tr>
<td class="leftnav"><div align="center"><img name="diamond" src="site/assets/diamond.gif" width="10" height="10" border="0" alt=""></div>
</td>
<td><a class="topnavlink" href="linktocome">LINK 6</a></td>
</tr>
<tr>
<td height="18" colspan="2" class="leftnav">&nbsp;</td>
</tr>
</table>
</td>
</tr>
<tr>
<td width="736" height="18" colspan="4" valign="top">&nbsp;</td>
</tr>
<tr>
<td width="22" height="1" valign="top"><img src="site/assets/transparent.gif" alt="" width="22" height="1"></td>
<td width="153" height="1" valign="top"><img src="site/assets/transparent.gif" alt="" width="153" height="1"></td>
<td width="35" height="1" valign="top"><img src="site/assets/transparent.gif" alt="" width="35" height="1"></td>
<td width="526" height="1" valign="top"><img src="site/assets/transparent.gif" alt="" width="526" height="1"></td>
</tr>
</table></td>
</tr>
</table>
</body>
</html>
 
Sort by date Sort by votes
Huh, first I would suggest you add a full and valid doctype to your site:
Second, you might think about scrapping tables in the same step as you're getting rid of frames. For about two years now tables are no longer best solution to layout your page and you should look at what we use now. Here's one of my favourite articles on that topic:
If you do decide to go down this path (good choice), just google for something like "css based design tutorial" and you should get a lot of great resources.

In case you don't want to have your website coded with up-to-date methods and want to stick with tables, I suggest you give borders to your tables while designing. You will then see where they are and why your things are where they are (and they only are that far in IE, not in other browsers).
 
Upvote 0 Downvote
Thanks--but tell me to learn something new to solve an immediate problem doesn't help me right now. Does anyone else see why that cell is not holding its vertical space?
 
Upvote 0 Downvote
There is a lot of argument these days as whether the use of tables is good or bad. I like tables because they work, although I do like the power of CSS for styling as no font tags are required.
None of this solves your problem.
The advice that Vragabond gave about turning your borders on is good and would reveal the problem.
The problem is in your table structure which has some missing cells.

Keith
 
Upvote 0 Downvote
Yes your page is displaying how it is coded to be displayed. One td is affecting the height of another td (this is normal for tables). The logo on the right the pwr logo height is lenghtening the height of the top banner or whatever. Heres a link what I am talking about.

You have two options.

here is the code to fix it
Code: 
          <TD vAlign=top width=175 bgColor=#ffffff colSpan=2 height=112 style="border:solid red"
          rowSpan=2><IMG height=112 src="PWR New Media_files/pwr_logol.jpg"
            width=175></TD>

I do suggest that you take Vragabond's advice and change your layout to css and have a valid doctype and good html.
 
Upvote 0 Downvote
Status
Not open for further replies.

Similar threads

PeDa
  • Locked
  • Question
Horizontal rule and CSS problem 2
Replies
2
Views
310
PeDa
PeDa
k4ghg
  • Locked
  • Question
Liquid vertical bar 1
Replies
2
Views
96
k4ghg
k4ghg
PSchubert
  • Locked
  • Question
Data in db table cell not displayed in asp table cell -- a CSS issue?
Replies
2
Views
87
vacunita
vacunita
Everton1Blue
  • Locked
  • Question
Google reCaptcha problem
Replies
4
Views
126
Everton1Blue
Everton1Blue
audiopro
  • Locked
  • Question
Problem with .htaccess
Replies
6
Views
96
ChrisHirst
ChrisHirst

Part and Inventory Search

Sponsor

Back
Top