Want to protect your cyber security and still get fast solutions? Ask a secure question today.Go Premium

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 244
  • Last Modified:

Table breaking

I would be glad to give some points to whoever manages to find out why the table on the top left corner breaks so ugly on this page:

http://www.johnnieb.net/index.htm
see how the first 2 pixel slice from the header (just before the J of Johnnie is displaced)

and not on this one

http://www.johnnieb.net/photographer.htm

The code is (supposed to be identical), as I copy-pasted it a few months ago.
Help would be greatly appreciated.
0
celeron128
Asked:
celeron128
  • 3
  • 2
1 Solution
 
tatkuuCommented:
Hello!

For some reason, picture in the first cell drops down a little bit. You can fix that by adding
valign="top" to your code like this

<tr>
   <td rowspan="4" valign="top"><img name="index_r1_c1" src=...

This will fix only the symptom. I'm stunned why the other pages are fine with the same code. So the real problem is still there...

-tatu
0
 
gamebitsCommented:
Line 54 to 65 on one script:

   <td colspan="10" valign="top" bgcolor="#000000"><p class="location"><a href="../../index.htm" class="location">Home</a> &gt; Phototgrapher</p>
     <p class="p1"><img src="images/photographer.jpg" alt="photgrapher" width="260" height="344" hspace="10" align="left">I've have admired famous photographers since I was a kid and I always wanted to be one of them. Now I just want to be myself. Nothing more and nothing less. </p>
     <p class="p1"> My experience with photocameras began when my father bought me a Russian Smena camera and explained me the basics of photography.</p>
     <p class="p1">After that he gave me a Russian Zenith - a nice camera back then. By now you have probably figured out that I lived during my childhood in the Eastern block. Indeed, I am born and mostly raised in Bulgaria, but I have travelled a lot. </p>
     <p class="p1">Now I live and work in Munich - Germany and enjoy life and photography.</p>
     <p class="p1">I hope you enjoy it too!</p>
     <p class="p1">Ivan</p>
     <p>&nbsp;</p>
     <p></p></td>
   <td><img name="index_r4_c13" src="images/index_r4_c13.jpg" width="15" height="513" border="0" alt=""></td>
   <td><img src="images/spacer.gif" width="1" height="513" border="0" alt=""></td>
  </tr>

Same line on the other script:

   <td colspan="10" valign="top" bgcolor="#000000"><table width="100%"  border="0">
     <tr>
       <th width="50%" align="left" valign="top" scope="col"><p class="location">Home</p>
         <p class="location">&nbsp;</p>
         <p class="p1"><a href="models/mike/index.htm" target="_top"><img src="images/mike_cover.jpg" width="50" height="65" border="0"></a> 7.05.2006 - New photo model added - <a href="models/mike/index.htm" target="_top">Mike</a> </p>
         <p class="p1"><a href="models/tarkan/index.htm" target="_top"><img src="images/tarkan_cover.jpg" width="50" height="71" border="0"></a>16.01.2006 - New photo model added <a href="models/tarkan/index.htm" target="_top">Tarkan</a></p>
         <p class="p1"><a href="models/franco/index.htm" target="_top"><img src="images/franco_cover.jpg" width="43" height="76" border="0"></a> 15.01.2006 - First addition to the models photogalleries - <a href="models/franco/index.htm">Franco</a>. Please be patient I am slowly filling it up... </p>
         <p></p></th>
       <th width="50%" class="td_borders" scope="col"><img src="./random/fprotate.php" alt="Random Image"></th>
     </tr>
   </table>     <p><span class="copyrights">(c) 2005-2006 All copyrights reserved.</span></p>
    <p></p>    <p></p>    <p></p>    <p></p>    <p></p></td>

On the second script you have an extra table (and I forgot the term for a table inside a table, it will get back to me eventually), so the two script are not identical.

Gamebits
0
 
celeron128Author Commented:
OK, 100 points reserved for tatkuu for curing the symptom!

I increase the points to 200. The other 100 go to whoever finds the source of the problem.

Gamebits: The term is nested tables. Of course the source of the whole 2 pages is not the same, since the content of the pages is different. The nested table however is holding the content BELOW the header and in theory should not affect the upper rows of the parent table.
The code for the heading bit (the johnnie b and menus part) is the same for both files, or at least that I think.
0
VIDEO: THE CONCERTO CLOUD FOR HEALTHCARE

Modern healthcare requires a modern cloud. View this brief video to understand how the Concerto Cloud for Healthcare can help your organization.

 
celeron128Author Commented:
I am not completely sure, but it may be that that cell is simply too big, because it spans over 4 rows instead of 2 as the next one. However the table is too complex for me to figure out where to correct it such that I spit it in 2 horizontally....
0
 
tatkuuCommented:
>I am not completely sure, but it may be that that cell is simply too big, because it spans over 4 rows instead of 2 as the next one.
>However the table is too complex for me to figure out where to correct it such that I spit it in 2 horizontally....

Or your picture is still too small. It is now 2px x 600 px. This page http://www.johnnieb.net/photographer.htm is not so high than the other one. Try to modify the picture for example to 2px x 800px.

-tatu
0
 
tatkuuCommented:
Hello!

Try to change border="1", then you can see better how the table works. I suggest finally that you
1. make the picture "index_r1_c1.jpg" smaller, to size 2px x 76 px.
2. change rowspan to value  2
3. and add one empty cell to the beginning of two rows below.

This should work.

-tatu


The code look like this:

  <tr>
   <td rowspan="2"><img name="index_r1_c1" src="images/index_r1_c1.jpg" width="2" height="600" border="0" alt=""></td>
   <td rowspan="2" colspan="2"><a href="/index.htm" target="_top"><img name="index_r1_c2" src="images/index_r1_c2.jpg" width="42" height="76" border="0" alt=""></a></td>
   <td colspan="3"><a href="/index.htm" target="_top"><img name="index_r1_c4" src="images/index_r1_c4.jpg" width="359" height="49" border="0" alt=""></a></td>
   <td colspan="7"><img name="index_r1_c7" src="images/index_r1_c7.jpg" width="547" height="49" border="0" alt=""></td>
   <td><img src="images/spacer.gif" width="1" height="49" border="0" alt=""></td>
  </tr>
  <tr>
   <td><img name="index_r2_c4" src="images/index_r2_c4.jpg" width="252" height="27" border="0" alt=""></td>
   <td><a href="/index.htm" target="_top"><img name="index_r2_c5" src="images/index_r2_c5.jpg" width="93" height="27" border="0" alt=""></a></td>
   <td colspan="3"><a href="#" onMouseOut="MM_startTimeout();" onMouseOver="MM_showMenu(window.mm_menu_0011031310_0,0,27,null,'index_r2_c6');"><img name="index_r2_c6" src="images/index_r2_c6.jpg" width="113" height="27" border="0" alt=""></a></td>
   <td><img name="index_r2_c9" src="images/index_r2_c9.jpg" width="121" height="27" border="0" alt=""></td>
   <td><img name="index_r2_c10" src="images/index_r2_c10.jpg" width="90" height="27" border="0" alt=""></td>
   <td><a href="/photographer.htm" target="_top"><img name="index_r2_c11" src="images/index_r2_c11.jpg" width="149" height="27" border="0" alt=""></a></td>
   <td colspan="2"><a href="/contact.htm" target="_top"><img name="index_r2_c12" src="images/index_r2_c12.jpg" width="88" height="27" border="0" alt=""></a></td>
   <td><img src="images/spacer.gif" width="1" height="27" border="0" alt=""></td>
  </tr>
  <tr>
   <td></td>
   <td colspan="12"><img name="index_r3_c2" src="images/index_r3_c2.jpg" width="948" height="11" border="0" alt=""></td>
   <td><img src="images/spacer.gif" width="1" height="11" border="0" alt=""></td>
  </tr>
  <tr>
   <td></td>
   <td><img name=...
0

Featured Post

What does it mean to be "Always On"?

Is your cloud always on? With an Always On cloud you won't have to worry about downtime for maintenance or software application code updates, ensuring that your bottom line isn't affected.

  • 3
  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now