Forum Moderators: open

Message Too Old, No Replies

html table not aligning to the top properly. =/

         

physh

9:52 pm on Feb 8, 2010 (gmt 0)

10+ Year Member



hello I am trying to align this table to the top of the div but it is just not working. I am editing this page straight through phpmyadmin.

The table should be just right under the BLOG title image but for some reason it just goes way lower. Any help would be much appreciated it.

This is the code I am using:

<table border="0">
<tr>
<center><td width=400px height=120px align="center" valign="middle">[url=http://twitter.com/businessname/][img]twitterlnk.png[/img][/url]
[url=http://www.facebook.com/group.php?alphanumeric/][img align=center]facebooklnk.png[/img][/url]</td>
<td width=100></td>
<td width=400px height=120px align="center" valign="middle"> mediatitle.png </td>
</tr>
<tr>
<td width=100></td>
<td></td>
<td></td>
</tr>
<tr>
<td width=400px height=523px align="center"><object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,0,0" type="application/x-shockwave-flash" width="400px" height="523px" id="InsertWidget_[alphanumeric-characters]" align="middle"><param name="movie" value="http://widgetserver.com/syndication/flash/wrapper/InsertWidget.swf"/><param name="quality" value="high" /><param name="wmode" value="transparent" /><param name="menu" value="false" /><param name="flashvars" value="r=2&appId=[alphanumeric-characters]" /> <embed src="http://example.com/syndication/flash/wrapper/InsertWidget.swf" name="InsertWidget_[alphanumeric-characters]" width="400px" height="523px" quality="high" menu="false" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" wmode="transparent" align="middle" flashvars="r=2&appId=[alphanumeric-characters]" /></object></td>
<td></td>
<td width=400px valign="middle" align=center><object width="340" height="285"><param name="movie" value="http://www.youtube-nocookie.com/v/[alphanumeric-characters]=en_US&fs=1&color1=0x3a3a3a&color2=0x999999&border=1"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube-nocookie.com/v/[alphanumeric-characters]=en_US&fs=1&color1=0x3a3a3a&color2=0x999999&border=1" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="340" height="285"></embed></object>




<object width="340" height="285"><param name="movie" value="http://www.youtube-nocookie.com/v/[alphanumeric-characters]&hl=en_US&fs=1&color1=0x3a3a3a&color2=0x999999&border=1"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube-nocookie.com/v/[alphanumeric-characters]=en_US&fs=1&color1=0x3a3a3a&color2=0x999999&border=1" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="340" height="285"></embed></object>
</td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td>
</td>
</tr>
</table>
</center>

[edited by: tedster at 1:05 am (utc) on Feb 25, 2010]
[edit reason] remove identifying information [/edit]

tedster

4:53 pm on Feb 9, 2010 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Hello physh, and welcome to the forums.

The first thing I would check is the W3C Validator for HTML [validator.w3.org]. You do not need to achieve 100% valid code, but with some kinds of invalid mark-up it can be impossible to fix a display problem.

Especially with an alignment issue, the doctype means a lot. If you are not declaring any DTD at all, that can complicate things.

rocknbil

10:01 pm on Feb 24, 2010 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Welcome aboard physh, that previous link won't help you at all (and will soon be removed.) As tedster mentioned, it's most likely due to invalid code - but a couple spotted right off:


<table border="0">
<tr>
<center><td width=400px height=523px align="center">

The center tag is deprecated, but the real problem is you can't put anything between <tr> and <td>. Second, when used as an attribute, this is correct:

<td width="400">

Or as an inline style,

<td style="width:400px">

But they are not interchangeable. Try this:

<table border="0" style="margin:0 auto 0 auto;">
<tr>
<td style="width:400px; height:523px; text-align:center">

Note also I have quoted the styles; this is required to validate.

Don't forget to remove the </center> tag as well, but it's likely the first center tag nested in there that's causing the space.

Second, empty cells will always be a problem in IE. Change them like so, with a non breaking space:

<td>&nbsp;</td>

Last, your code "as posted" will never validate as is, it has inline BBcodes and/or markers for obvious replacement on output that will cause validation errors. Update the database, then put the url to the resulting page in the validator to see if it comes close. The <embed> nested inside <object> will never validate, but you can eliminate other errors.

rocknbil

2:25 am on Feb 27, 2010 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



EDIT Well, now the previous link is tedster's to the validator, which is definately a helpful link. :-)