The Web Design Group

... Making the Web accessible to all.

Welcome Guest ( Log In | Register )

 
Reply to this topicStart new topic
> Irritating Tables/Cells
joelreed
post Feb 22 2007, 07:15 PM
Post #1





Group: Members
Posts: 1
Joined: 22-February 07
Member No.: 2,002



Basically I have design a site in an early stage, have tables and cells and a lot of tds trs, but I am having problems with two of the tables, the welcome table and recent viewed table overlap one another, by this I mean as you add text in to the welcome table it overlaps the recent viewed one causing the recent viewed table to move and be in affect overtaken by the welcome, i know stuff like valign etc stops it moving etc but cannot work this one out, any help would be sound, just try adding text in to welcome and see what happens.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/strict.dtd">

<HTML>
<HEAD>
<TITLE>
The Comic Book Store - Telford, Shropshire - Home
</TITLE>
<LINK REL="stylesheet" HREF="cbs.css" type="text/css">
</HEAD>

<BODY>

<!-- Start of Comic Book Store Banner Section -->
<div align= center>
<a href="#"><IMG SRC="cbsbanner.jpg" BORDER=0 ALIGN="middle" alt="The Comic Book Store: Click Here to return to Home Page" width="770" height="150"></a>
</div>
<!-- End of Comic Book Store Banner Section -->

<!-- Start of Welcome/Time/Date Section -->
<TABLE cellspacing=0 cellpadding=0 width="770" valign="top" ALIGN=center>
<TR><TD><div id="welcome">
<H4>
Add Welcome/Time/Date In PHP
</H4>
</TR></TD>
</TABLE>
<!-- End of Welcome/Time/Date Section -->

<!-- Start of Overall Table -->
<TABLE cellspacing=0 cellpadding=0 width="770" valign=top ALIGN=center BORDER="0">
<TR>
<TD>
<!-- Start of Left Column-->
<!-- Start of Menu-->
<TABLE cellspacing=6 cellpadding=0 width="170" valign=top ALIGN=left BORDER="0">
<TR><TD width="170"><div id="menu">
<IMG SRC="menutab.jpg" BORDER=0 ALIGN="left" alt="Menu" width="170" height="30">
<BR><BR><BR>
<a href="#">Home</a>
<a href="#">Catalogue</a>
<a href="#">Search</a>
<a href="#">Store News</a>
<a href="#">Contact</a>
<a href="#">Basket</a>
<BR>
</div>
</TD>
</TR>
<!-- End of Menu-->
<!-- Start of Search-->
<TR><TD width="170">
<IMG SRC="searchtab.jpg" BORDER=0 ALIGN="left" alt="Search" width="170" height="30">
<BR><BR><BR>
<P>
Add Search Engine Here
</P>
<BR>
</TD>
</TR>
<!-- End of Search-->
<!-- Start of Advertisement Section -->
<TR><TD width="170">
<IMG SRC="adstab.jpg" BORDER=0 ALIGN="left" alt="Advertisements" width="170" height="30">
<BR><BR><BR>
<P>
Add Advertisements
</P>
<BR>
</TD>
</TR>
<!-- End of Advertisement Section -->
</TABLE>
<!-- End of Left Column-->

<!-- Start of Welcome - Right Column-->
<TABLE cellspacing=6 cellpadding=0 width="570" valign=top valign=bottom ALIGN=right BORDER="0">
<TR><TD width="580">
<IMG SRC="welcometab.jpg" BORDER=0 ALIGN="left" alt="Welcome" width="570" height="30">
<BR><BR>
<P>
Welcome To The <STRONG>Comic Book Store</STRONG>. The Comic Book Store, which is based in Telford, Shropshire, is dedicated to
fulfilling the needs of comic book enthusiasts in the Midlands area.
</P>
</TD>
</TR>
</TABLE>
<!-- End of Welcome - Right Column-->
<BR><BR><BR><BR><BR><BR>
<!-- Start of Recent Added/Viewed - Right Column-->
<TABLE cellspacing=6 cellpadding=0 width="570" valign=top ALIGN=right BORDER="0">
<TR><TD width="580">
<IMG SRC="addedtab.jpg" BORDER=0 ALIGN="left" alt="Recently Added Comics" width="570" height="30">
<BR><BR>
<P>
<STRONG>Recently Added Comic Books At The Comic Book Store, Telford.</STRONG>
</P>
</TD>
</TR>
</TABLE>
</BODY>
</HTML>
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
pandy
post Feb 22 2007, 11:50 PM
Post #2


Don't like donuts. Don't do MySpace.
********

Group: WDG Moderators
Posts: 17,939
Joined: 9-August 06
Member No.: 6



So do you use abolute positioning in that style sheet? The URL to a sample page would make this easier to fugure out.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Christian J
post Feb 23 2007, 05:05 AM
Post #3


.
********

Group: WDG Moderators
Posts: 7,858
Joined: 10-August 06
Member No.: 7



QUOTE(joelreed @ Feb 23 2007, 01:15 AM) *

just try adding text in to welcome and see what happens.

True, the content overlaps (even without any CSS positioning). Probably this is caused by the TABLE (not TD) ALIGN attributes, like

<TABLE cellspacing=6 cellpadding=0 width="570" valign=top valign=bottom ALIGN=right BORDER="0">

In fact I think you should be able to use just one single table for the whole layout, rather than nesting several ones which will just complicate things.

You should also fix the HTML errors reported by the validator (see link at the top of this page).


User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post

Reply to this topicStart new topic
1 User(s) are reading this topic (1 Guests and 0 Anonymous Users)
0 Members:

 



- Lo-Fi Version Time is now: 20th July 2018 - 08:42 PM