PHP table is pushing content from the PrimaryContent Area to under the footer help?

I have a 3 column website that utilizes php to call data from MySQL and other .php pages. In the PrimaryContent area I would like to display a table that is retrieved from MySQL. My code does this however the table has so many records(I believe) that it will not display in its PrimaryContent area it pushes to below the footer. I've tried css adding a table-layout, nothing is working how can I trim down this table IF it is the isssue? All other pages work fine within the Primary Content area.
<body>
<div id="outer">
	<div id="header">
    
    <!-- USE THIS AS THE RELATIVE LINK - ../CookeK/content/themes/phpmysql/ -->
    
    	<?php include "../CookeK/content/themes/phpmysql/header.php"; ?>
        
		
	</div>
	<div id="menu">
    	<?php include "../CookeK/content/themes/phpmysql/menu.php"; ?>
		
	</div>
	<div id="content">
		<div id="primaryContentContainer">
			<div id="primaryContent"> 		<!-- primaryContent - START -->
            
<?php		    if (isset($_GET['menukey'])) {
			$menukey = $_GET['menukey'];
		    } else {
			$menukey = 0;
		    }
		    switch ($menukey) {
			case 1:
        			include "../CookeK/content/themes/phpmysql/primarycontent.php";
			        break;
			case 2:
		         	include "../CookeK/content/themes/phpmysql/aboutme.php";
	        		break;
			case 3:
        			include "../CookeK/content/themes/phpmysql/projects.php";
			        break;
	    		case 4:
		        	include "../CookeK/content/themes/phpmysql/classes.php";
	        		break;
			case 5:
				readfile("../Cookek/content/themes/phpmysql/contact.php");
			        break;
	    		case 6:
		        	include "http://www.yahoo.com";
	        		break;
				case 7:
		        	include "../Cookek/content/themes/phpmysql/AdvisorsEdit.php";
	        		break;
				case 8:
		        	include "../Cookek/content/themes/phpmysql/AdvisorsEditPost.php";
	        		break;
				case 9:
		        	include "../Cookek/content/themes/phpmysql/view_customers.php";
	        		break;
			default:	// case else
        			include "../CookeK/content/themes/phpmysql/primarycontent.php";
		        	break; 
		    }
?>

		</div>  				<!-- primaryContent - END -->
        
	</div>
    
		<div id="secondaryContent">
        	
            <?php include "../Cookek/content/themes/phpmysql/secondaryContent.php"; ?>
            
			
		</div>
		<div class="clear"></div>
	</div>
	<div id="footer">
    	
        <?php include "../Cookek/content/themes/phpmysql/footer.php"; ?>
       
	</div>
</div>
</body>

//*************************************

//This is the content that keeps appearing under the footer

//
<?php

$db_host = 'localhost';
$db_user = '*****';
$db_pwd = '*****';

$database = '*****';
$table = 'customers';

if (!mysql_connect($db_host, $db_user, $db_pwd))
    die("Can't connect to database");

if (!mysql_select_db($database))
    die("Can't select database");

	
	//CONCAT ((LEFT(FirstName, 1)), (LEFT(MiddleName, 1)), LastName) AS Username,, zlu_carcolor.Description AS 'Car Color', zlu_computer.Description AS Computer, IsLaptop, zlu_Race.Description AS Race, zlu_Residence.Description AS Residence, zlu_birthmonth.Description AS 'Birth Month' FROM {$table}, zlu_Cars, zlu_carcolor, zlu_computer, zlu_race, zlu_residence, zlu_birthmonth
	
	//, zlu_CarColor.Description AS 'Car Color', zlu_Computers.Description AS Computer, IsLaptop, zlu_Race.Description AS Race, zlu_Residence.Description AS Residence, zlu_BirthMonth.Description
	
// sending query 

$result = mysql_query("SELECT CustomerID, OldCustomerID, CONCAT_WS(', ', LastName, FirstName, MiddleName) AS 'Customer Name',CONCAT ((LEFT(FirstName, 1)), (LEFT(MiddleName, 1)), LastName) AS Username, CarID AS Cars, CarColorID AS 'Car Color', ComputerID AS Computer, IsLaptop AS Laptop, RaceID AS Race, ResidenceID AS Residence, BirthMonthID AS 'Birth Month'
FROM cookek.customers 
WHERE CustomerID BETWEEN 500 AND 600
ORDER BY LastName");

//INNER JOIN cookek.zlu_cars ON cookek.customers.CarID = cookek.zlu_cars.CarID 


if (!$result) {
    die("Query to show fields from table failed");
}

$fields_num = mysql_num_fields($result);



echo "<table border='1'><tr>";

for($i=0; $i<$fields_num; $i++)
{
    $field = mysql_fetch_field($result);
    echo "<td>{$field->name}</td>";
}
echo "</tr>\n";

while($row = mysql_fetch_row($result))
{
    echo "<tr>";


    foreach($row as $cell)
        echo "<td>$cell</td>";

    echo "</tr>\n";
}
mysql_free_result($result)

?>

Open in new window

corporateKeenanAsked:
Who is Participating?
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

Marco GasiFreelancerCommented:
If in css you give to div PrimaryContent this attribute:

overflow:auto;

then for contents wich exceed the available space, it will be added automatically a scrollbar to scroll contents. The scrollbar will not be added for content wich don't exceed tha vailable space

Best regards
0
corporateKeenanAuthor Commented:
@marqusG

 I've tried the overflow: auto; attribute and it seems to be unrecognized and it is still dropping to belowthe footer with no scroll bar.
0
Marco GasiFreelancerCommented:
Do you have set a fixed height and width? overflow attribute is ignored if these attributes are not set.
0
The Ultimate Tool Kit for Technolgy Solution Provi

Broken down into practical pointers and step-by-step instructions, the IT Service Excellence Tool Kit delivers expert advice for technology solution providers. Get your free copy for valuable how-to assets including sample agreements, checklists, flowcharts, and more!

corporateKeenanAuthor Commented:
I had them set at one point and everything moved to the center of the page including the secondaryContent.php(sidebar). Here is a code from my CSS still no luck:
/* Basic */
*
{
	margin: 0em;
	padding: 0em;
}

h1,h2,h3,h4,h5,h6
{
	color: #2e6e1a;/*#6a6a6a;*/
}

body
{
	font-family: "Trebuchet MS", sans-serif;
	color: #7a7a7a;
	font-size: 11pt;
}

a
{
	color: #AF0A0A;
	text-decoration: underline;
}

a:hover
{
	text-decoration: none;
}

/* Outer */

#outer
{
	margin: 2.5em 3.0em 1.5em 3.0em;
}

/* Header */

#header
{
	padding: 0em 1.5em 0em 1.5em;
	height: 8em;
	width: 15em;
	float: left;
	position: relative;
	background: /*#AF0A0A*/ url('/Cookek/images/a1.gif') top right no-repeat;
}

#header h1
{
	position: absolute;
	bottom: 2.2em;
	font-size: 1.5em;
	letter-spacing: 0.1em;
}

#header h1 a
{
	color: #fff;
	text-decoration: none;
}

#header h2
{
	position: absolute;
	bottom: 2.7em;
	color: #EFE0E0;
	font-size: 0.8em;
}

/* Menu */

#menu
{
	height: 8em;
	background: #fafafa url('/Cookek/images/a2.gif') top left repeat-x;
	margin-left: 18em;
	position: relative;
}

#menu ul
{
	list-style: none;
	position: absolute;
	top: 3.3em;
	margin-left: 1.5em;
}

#menu li
{
	display: inline;
	border-left: dotted 1px #848484;
	padding-left: 0.8em;
}

#menu li.first
{
	border-left: 0px;
	padding-left: 0em;
}

#menu li a
{
	text-decoration: none;
	color: #6a6a6a;
	font-weight: bold;
	padding: 0.8em;
	margin-right: 0.8em;
	font-size: 0.9em;
}

#menu li a:hover
{
	background: #009900/*#AF0A0A url('/Cookek/images/a4.gif') */bottom left repeat-x;
	color: #fff;
}

/* Content */

#content
{
	background: #fff url('/Cookek/images/a3.gif') top left repeat-x;
	margin-top: 1px;
	padding-top: 1.5em;
}

#content p
{
	margin-bottom: 1.5em;
	line-height: 1.6em;
}

#content h2
{
	font-size: 1.5em;
}

#content h3
{
	font-size: 1.1em;
}

#content h2,h3,h4,h5,h6
{
	padding-bottom: 0.2em;
	margin-bottom: 1.2em;
	border-bottom: dotted 1px #cacaca;
}

#content ul
{
	margin-bottom: 1.5em;
	padding-left: 1em;
	line-height: 1.6em;
}

#content blockquote
{
	border-left: solid 0.8em #cacaca;
	padding: 0.5em 0em 0.5em 1.0em;
	margin-bottom: 1.5em;
	line-height: 1.6em;
}

#content blockquote p
{
	display: inline;
}

#content table
{
	border: dotted 1px #cacaca;
	padding: 0.5em;
	margin-bottom: 1.5em;
}

#content table th
{
	text-align: left;
	font-weight: bold;
	padding: 0.5em;
}

#content table td
{
	padding: 0.5em;
}

#content table tr.rowA
{
	background-color: #f5f5f5;
	color: inherit;
}

#content table tr.rowB
{
	background-color: #fdfdfd;
	color: inherit;
}

/* Primary Content */

#primaryContentContainer
{
	float: right;
	margin-left: -19em;
	
	
	width: 100%;
	overflow: auto;

}

#primaryContentContainer table
{
	table-layout: fixed;
	height: 100%;
	width: 100%;
	overflow: auto;
}



#primaryContent
{
	margin: 0em 0em 0em 18em;
	padding: 1.5em;
	border-left: dotted 1px #cacaca;
	overflow: auto;
}

#primaryContent table
{
	table-layout: fixed;
	height: 100%;
	width: 100%;
	overflow: auto;
}

/* Secondary Content */

#secondaryContent
{
	float: left;
	width: 15em;
	padding: 1.5em;
	overflow: auto;
}

/* Footer */

#footer
{
	margin-top: 1.0em;
	border-top: dotted 1px #cacaca;
	padding: 1.5em;
	font-size: 0.5em;
	text-align: center;
	overflow: auto;
}

.clear
{
	clear: both;
}







	/* ADVISORS START CSS */

#advisors *
{
	margin: 0em;
	padding: 0em;
}

#advisors body
{
	font-family: Verdana ;
	color: #000000;
	font-size: 11pt;
}

#advisors textarea
{
	padding: 5px;
	background-color: #FBFBFB;
	width: 460px;
	height: 200px;
	font-size: small;
	font-family: Verdana;
}

#advisors input.txt
{
	background-color: #FBFBFB;
	font-size: small;
	font-family: Verdana;
	height: auto;
	padding:1px;
}

#advisors input.txtwide
{
	background-color: #FBFBFB;
	width: 460px;
	font-size: small;
	font-family: Verdana;
	height: auto;
	padding:1px;
}

#advisors input.txtmedium
{
	background-color: #FBFBFB;
	width: 140px;
	font-size: small;
	font-family: Verdana;
	height: auto;
	padding:1px;
}

#advisors td.radiobtn
{
	font-size: small;
	font-family: Verdana;
	height: auto;
	padding:1px;
}


#advisors tr.aligntop
{
	vertical-align: top;
	font-size: x-small;
	font-family: Verdana;

}

#advisor select /* dropdown list */
{
	width: 463px;
	font-size: small;
	font-family: Verdana;
}

#advisors #chklist
{
	padding: 5px;
	border: 1px solid blue;
	font-family: Verdana;
	font-size: 10pt;
	color: blue;
	overflow: auto;
	background: white;
	width: 460px;
	height: auto;
}

 <!--ADVISORS END-->

Open in new window

0
Marco GasiFreelancerCommented:
I see this:

#primaryContent
{
      margin: 0em 0em 0em 18em;
      padding: 1.5em;
      border-left: dotted 1px #cacaca;
      overflow: auto;
}

#primaryContent table
{
      table-layout: fixed;
      height: 100%;
      width: 100%;
      overflow: auto;
}

You don't have to set overflow for table but for div. Width has to be set in pixels so you have to try to find the right value. To do it I suggest to set background color to a color you see immediatly. So  you should write this:

#primaryContent
{
      margin: 0em 0em 0em 18em;
      padding: 1.5em;
      border-left: dotted 1px #cacaca;
        height: 300px; //try several values
        background.color:#ff0000; /to delete after right height is found
      overflow: auto;
}

Hope this helps
0
corporateKeenanAuthor Commented:
Thanks, elements are moving and I have a scroll bar now but the content still falls under the footer and the sidebar is also connected to the PrimaryContent area.
0
Marco GasiFreelancerCommented:
I would try to comment width and height for primaryContent table and comment promaryContentContainer table (since it's not used in this page).
0

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
Marco GasiFreelancerCommented:
Where is sidebar code? and css?
0
Marco GasiFreelancerCommented:
Do you still need assistance with this question?
0
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
PHP

From novice to tech pro — start learning today.