-
1. What is up with my vertical spacing?
polar_bare Oct 23, 2009 7:59 AM (in response to thersher)Table... after table... after table.
You have so many tables that it is hard to navigate the code.
You might want to transition to a two column css design with a header and a footer.
I tried to look at the code, but I don't have the time right now to look it over closely.
Jim
-
2. Re: What is up with my vertical spacing?
E. Michael Brandt Oct 23, 2009 12:34 PM (in response to thersher)The problem you are having is that the content in the apparent-left column and the content in the apparent-main column are both contained within the same <tr> tag (the same table row) AND you are using multiple rows for these two content areas. So, as the content of one td (table cell) grows in height with additional content, necessarily the height of all cells in that row will grow as well. Therefore as you add content to the apparent-right column, the apparent-left column gets too spaced out.
I am not at all clear why you are using so many table rows. Simply use one row for your content: put all your left column content into one cell, the graphic for the column divider into another cell, and all your right column content into yet another cell in that row, and i think it will all work okay. You may have to set the cell's "valign" value to "top".
(Of course at some point you may decide no longer use tables for layout, but that is another whole discussion, and the conversion to table-less layout is very often not easily accomplished.)
--
E. Michael Brandt
www.divahtml.com
www.divahtml.com/products/scripts_dreamweaver_extensions.php
Standards-compliant scripts and Dreamweaver Extensions
www.valleywebdesigns.com/vwd_Vdw.asp
JustSo PictureWindow
JustSo PhotoAlbum, et alia
-- -
3. Re: What is up with my vertical spacing?
thersher Oct 23, 2009 2:05 PM (in response to E. Michael Brandt)Thanks Michael. I have tried to get away from using so many tables, but then I seem to have even MORE formatting issues. The reason I have so many table rows, is that some of the content in the same column is left aligned and some is center aligned, and that isn't working if it's all in one row. For example, the logo is center aligned, but the spry menu is left aligned. If I center align the spry menu, it overlaps the green column divider. Also, the main table is actually nested inside the actual main table. I know, we're supposed to be moving away from tables, but I just haven't arrived there yet.
I do have all the table rows vertical aligned to top, at least in the left column.
Theresa Sheridan Enterprises
Graphic Design ~ Website Design ~ Virtual Assistance
559.306.7887
www.theresasheridan.com
-
4. Re: What is up with my vertical spacing?
bregent Oct 23, 2009 2:12 PM (in response to thersher)>I know, we're supposed to be moving away from tables, but I just haven't arrived there yet.
Then you probably want to actually add more nested tables. You are currently using row and column spans in that area which is probably messing things up. Avoid using row/col spans and insert another nested table instead. Then add 3 rows to that and you should be fine.
-
5. Re: What is up with my vertical spacing?
E. Michael Brandt Oct 23, 2009 3:27 PM (in response to thersher)I have recreted a table for you that contains the content from you broccoli page as an example You do not need a table cell to cneter protions of an individual cell - you can use a di, in this case with a class="ctr", and add this to yoru css :
.ctr {
text-align: center;
}I have not attempted to do this precisely matching yorus. But it does let you see how to do this without nexting lots of tables or using lots of table cells:
<table width="100%" border="0" cellspacing="0">
<tr>
<td valign="top"><img src="images/popatoplogo.jpg" width="164" height="184">
<ul id="MenuBar1" class="MenuBarVertical">
<li><a href="harvester.html">Broccoli Floret Harvester</a></li>
<li><a href="3-in-1_unit.html">3-in-1 Online Unit</a></li>
<li><a href="broccoli_online_unit.html">Broccoli Online Floret Unit</a></li>
<li><a href="cauliflower_online_unit.html">Cauliflower Online Floret Unit</a></li><li><a href="clients.html">Satisfied Clients</a></li>
<li><a href="index.html">Home</a></li>
</ul>
<div class="ctr">
<p>Dealer inquiries from<br>
all countries welcome! </p>
<p class="style1">Agra-Best, LLC<br>
P.O. Box 1854<br>
Bakersfield, CA 93303</p>
<p class="style1">David Vargas<br>
661.477.3663<br>
<a href="mailto:david@agrabest.com">david@agrabest.com</a></p>
<p class="style1">Keith Randall<br>
661.243.6421<br>
<a href="mailto:keith@agrabest.com">keith@agrabest.com</a> </p> </div></td>
<td width="6" bgcolor="#254925"> </td>
<td valign="top"><h2><span class="style2">Broccoli & Cauliflower Floretting Field Harvesting Machine</span></h2><img src="images/harvester.jpg" width="575" height="259">
<p>This machine uses a developed "cutting edge" technology to deliver cutting consistency and convenience while minimizing the need for hand labor.</p>
<ul>
<li>Designed for a large variety of broccoli and cauliflower types and dimensions.</li>
<li>Harvester has the capacity of floretting 52-60 units per minute, or 900 to 1200 lbs per hour with a single-row harvester; 672 units per minute and up to 10,000 lbs per hour with a 12-row harvester.</li><li>Reduces labor by 60% over hand harvesting!</li>
<li>Core waste materials are automatically fed out of the harvester.</li>
<li>Harvesters are custom built to your needs (1 to 12 rows) and are 100% stainless steel construction.</li>
</ul>
<div class="ctr">
<p>Click here to download printable brochure.</p>
Harvester Video<br>
<object width="425" height="344">
<param name="movie" value="http://www.youtube.com/v/EciURvL15Zw&hl=en&fs=1">
</param>
<param name="allowFullScreen" value="true">
</param><param name="allowscriptaccess" value="always">
</param>
<embed src="http://www.youtube.com/v/EciURvL15Zw&hl=en&fs=1" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="425" height="344"></embed>
</object>
</div></td>
</tr>
</table>Hope that helps.
--
E. Michael Brandt
www.divahtml.com
www.divahtml.com/products/scripts_dreamweaver_extensions.php
Standards-compliant scripts and Dreamweaver Extensions
www.valleywebdesigns.com/vwd_Vdw.asp
JustSo PictureWindow
JustSo PhotoAlbum, et alia
--



