Jump to content

3 Columns achieved but I need some help, please

janniesekind

By janniesekind
in PHP Coding Help

 Share

Recommended Posts

janniesekind Newbie

janniesekind

Posted
Posted

Hey everyone.

 

I am totally numb.

 

I've posted this on daniweb.com but I suppose no one is able to help em with this.

 

Maybe it is impossible.

 

I dont care how I achieve this, via css, or tables, as long as I get it.

 

I have a small classifieds site for a local church.

 

Categories and sub categories are created from the admin section. So the page needs to be created dynamicly.

 

The result is exactly what I want, except for the huge gaps. This is an html sample of what I have : (please bear with me, please)

 

###########################################################################################

<table width="100%" border="1" cellspacing="0" cellpadding="0">
  <tr>
    <td width="30%" valign="top">Category Title<br />
    --> Sub title/link<br />
    --> Sub title/link<br />
    --> Sub title/link<br />
    --> Sub title/link</td>
    <td width="30%" valign="top">Category Title<br />
--> Sub title/link<br />
--> Sub title/link<br />
--> Sub title/link<br />
--> Sub title/link<br />
--> Sub title/link<br />
--> Sub title/link<br />
--> Sub title/link<br />
--> Sub title/link<br />
--> Sub title/link<br />
--> Sub title/link<br />
--> Sub title/link<br />
--> Sub title/link<br />
--> Sub title/link</td>
    <td width="30%" valign="top">Category Title<br />
--> Sub title/link<br />
--> Sub title/link<br />
--> Sub title/link<br /></td>
  </tr>
  <tr>
    <td width="30%" valign="top">Category Title<br />
--> Sub title/link<br />
--> Sub title/link<br />
--> Sub title/link<br />
--> Sub title/link<br />
--> Sub title/link<br />
--> Sub title/link<br />
--> Sub title/link<br />
--> Sub title/link<br />
--> Sub title/link<br />
--> Sub title/link <br />
--> Sub title/link<br />
--> Sub title/link</td>
    <td width="30%" valign="top">Category Title<br />
--> Sub title/link<br />
--> Sub title/link<br />
--> Sub title/link<br />
--> Sub title/link</td>
    <td width="30%" valign="top">Category Title<br />
--> Sub title/link<br />
--> Sub title/link<br />
--> Sub title/link<br />
--> Sub title/link<br />
--> Sub title/link<br />
--> Sub title/link<br />
--> Sub title/link</td>
  </tr>
  <tr>
    <td width="30%" valign="top">Category Title<br />
--> Sub title/link<br />
--> Sub title/link<br />
--> Sub title/link</td>
    <td width="30%" valign="top">Category Title<br />
--> Sub title/link<br />
--> Sub title/link<br />
--> Sub title/link<br />
--> Sub title/link</td>
    <td width="30%" valign="top">Category Title<br />
--> Sub title/link<br />
--> Sub title/link</td>
  </tr>
  </table>

 

###########################################################################################

 

 

 

this is what I want

 

 

 

###########################################################################################

<table width="100%" border="1" cellspacing="0" cellpadding="0">
  <tr>
    <td width="30%" valign="top">
    <table width="100%" border="1" cellspacing="0" cellpadding="0">
      <tr>
        <td>Category Title</td>
      </tr>
      <tr>
        <td>--> Sub Title / Link<br>
          --> Sub Title / Link<br>
          --> Sub Title / Link<br>
          --> Sub Title / Link</td>
      </tr>
    </table>
    <br>
    <table width="100%" border="1" cellspacing="0" cellpadding="0">
      <tr>
        <td>Category Title</td>
      </tr>
      <tr>
        <td>--> Sub Title / Link<br>
          --> Sub Title / Link<br>
          --> Sub Title / Link <br>
          --> Sub Title / Link<br>
          --> Sub Title / Link<br>
          --> Sub Title / Link <br>
          --> Sub Title / Link</td>
      </tr>
    </table>
    <br>
    <table width="100%" border="1" cellspacing="0" cellpadding="0">
      <tr>
        <td>Category Title</td>
        </tr>
      <tr>
        <td>--> Sub Title / Link<br>
          --> Sub Title / Link<br>
          --> Sub Title / Link<br>
          --> Sub Title / Link<br>
          --> Sub Title / Link <br>
          --> Sub Title / Link</td>
        </tr>
    </table></p></td>
    <td width="30%" valign="top"><table width="100%" border="1" cellspacing="0" cellpadding="0">
      <tr>
        <td>Category Title</td>
      </tr>
      <tr>
        <td>--> Sub Title / Link<br>
          --> Sub Title / Link<br>
          --> Sub Title / Link<br>
          --> Sub Title / Link<br>
          --> Sub Title / Link<br>
          --> Sub Title / Link<br>
          --> Sub Title / Link<br>
          --> Sub Title / Link</td>
      </tr>
    </table>
    <br>
    <table width="100%" border="1" cellspacing="0" cellpadding="0">
      <tr>
        <td>Category Title</td>
      </tr>
      <tr>
        <td>--> Sub Title / Link<br>
          --> Sub Title / Link<br>
          --> Sub Title / Link<br>
          --> Sub Title / Link<br>
          --> Sub Title / Link<br>
          --> Sub Title / Link</td>
      </tr>
    </table>
    <br>
    <table width="100%" border="1" cellspacing="0" cellpadding="0">
      <tr>
        <td>Category Title</td>
      </tr>
      <tr>
        <td>--> Sub Title / Link<br>
          --> Sub Title / Link<br>
          --> Sub Title / Link</td>
      </tr>
    </table></td>
    <td width="30%" valign="top"><table width="100%" border="1" cellspacing="0" cellpadding="0">
      <tr>
        <td>Category Title</td>
      </tr>
      <tr>
        <td>--> Sub Title / Link<br>
          --> Sub Title / Link<br>
          --> Sub Title / Link</td>
      </tr>
    </table>
    <br>
    <table width="100%" border="1" cellspacing="0" cellpadding="0">
      <tr>
        <td>Category Title</td>
      </tr>
      <tr>
        <td>--> Sub Title / Link<br>
          --> Sub Title / Link<br>
          --> Sub Title / Link<br>
          --> Sub Title / Link<br>
          --> Sub Title / Link<br>
          --> Sub Title / Link</td>
      </tr>
    </table>
    <br>
    <table width="100%" border="1" cellspacing="0" cellpadding="0">
      <tr>
        <td>Category Title</td>
      </tr>
      <tr>
        <td>--> Sub Title / Link<br>
          --> Sub Title / Link<br>
          --> Sub Title / Link<br>
          --> Sub Title / Link<br>
          --> Sub Title / Link<br>
          --> Sub Title / Link<br>
          --> Sub Title / Link<br>
          --> Sub Title / Link</td>
      </tr>
    </table></td>
  </tr>
</table>

 

###########################################################################################

 

and this is my php code to achieve what I currently have

 

###########################################################################################

<?php
if (!function_exists("GetSQLValueString")) { require_once ($FolderFunctions.'getvaluestring.php'); } 
mysql_select_db($database_classi, $classi);
$query_docategories = "SELECT catID, Title, ParentCat, `Description`, `Sort` FROM category WHERE ParentCat = '0' ORDER BY Sort ASC";
$docategories = mysql_query($query_docategories, $classi) or die(mysql_error());
$row_docategories = mysql_fetch_assoc($docategories);
$totalRows_docategories = mysql_num_rows($docategories);
?>
<h1>
<?php echo $lanClassifiedAds; ?>
</h1>
<div class="homelist">
<table border="0" width="100%">
	<?php
	//set 3 to 4 of you want 4 columns. Set it to 5 if you want 5, etc
	$numcols = 4; // how many columns to display
	$numcolsprinted = 0; // no of columns so far

	// get the results to be displayed
	mysql_select_db($database_classi, $classi);
	$query = "SELECT * FROM category WHERE ParentCat = '0'";
	$mysql_result = mysql_query($query, $classi);

	// get each row
	while($myrow = mysql_fetch_row($mysql_result))
	{ ?>

		<?php
		$in= $myrow[3].'<br>';

		if ($numcolsprinted == $numcols) {
		print "</tr>\n<tr>\n";
		$numcolsprinted = 0;
	}

	// output row from database
	echo "<td class='valigntop'><div class='homelistbottompad'><div class='homepagecategories'>$in</div>"; ?>

	<?php
	mysql_select_db($database_classi, $classi);
	$query_dosubcategories = "SELECT catID, Title, ParentCat, `Description`, `Sort` FROM category WHERE ParentCat = '".$myrow[0]."' ORDER BY Sort ASC";
	$dosubcategories = mysql_query($query_dosubcategories, $classi) or die(mysql_error());
	$row_dosubcategories = mysql_fetch_assoc($dosubcategories);
	$totalRows_dosubcategories = mysql_num_rows($dosubcategories);
	?>          
	<?php do { ?>
		<div class="subpagecategories">&#8226; <a href="<?php echo 'ads-List_'.$row_dosubcategories['catID']; ?>.html" class="list" title="<?php echo $row_dosubcategories['Title']; ?> | <?php echo $row_meta['SiteTitle']; ?> - <?php echo $row_meta['SiteSlogan']; ?>"><?php echo			 $row_dosubcategories['Title']; ?></a> 
		<?php
		mysql_select_db($database_classi, $classi);
		$query_getcount = "SELECT itemID,CatID FROM item WHERE catID = '".$row_dosubcategories['catID']."' AND Status='Active'";
		$getcount = mysql_query($query_getcount, $classi) or die(mysql_error());
		$row_getcount = mysql_fetch_assoc($getcount);
		$totalRows_getcount = mysql_num_rows($getcount);
		echo '('.$totalRows_getcount.')'; ?></div>
	<?php } while ($row_dosubcategories = mysql_fetch_assoc($dosubcategories)); ?>

	<?php echo "</td>\n";

	// bump up row counter
	$numcolsprinted++;

	} // end while loop

	$colstobalance = $numcols - $numcolsprinted;
	for ($i=1; $i<=$colstobalance; $i++) {

	}
	print "<TD></div></TD>\n";
	?>
</table>
</div>

###########################################################################################

 

 

[attachment deleted by admin]

Link to comment
Share on other sites
xlxprophetxlx Member

xlxprophetxlx

Posted
Posted

I think your over complicating the code.  I would do this for example (use for a basic structure; modify as needed):

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</head>

<body>
<style type="text/css">
html, body{
margin:0;
padding:0;
}
#container{
margin:0 auto; /* Too Center the Div */
width:960px; /* For Example */
}
#container div{
float:left;
display:inline;
width:300px;  /* Even Columns while compensating for padding */
padding:10px;	
}
</style>
<div id="container">
    <div>
    	<!--New Query-->
    	<h1>Category Title</h1>
        <ul>
        	<li>list item</li>
            <li>list item</li>
            <li>list item</li>
            <li>list item</li>
        </ul>
        
        <!--New Query-->
        <h1>Category Title</h1>
        <ul>
        	<li>list item</li>
            <li>list item</li>
            <li>list item</li>
            <li>list item</li>
        </ul>
    </div>
    <div>
    	<!--New Query-->
    	<h1>Category Title</h1>
        <ul>
        	<li>list item</li>
            <li>list item</li>
            <li>list item</li>
            <li>list item</li>
        </ul>
    </div>
    <div>
    	<!--New Query-->
    	<h1>Category Title</h1>
        <ul>
        	<li>list item</li>
            <li>list item</li>
            <li>list item</li>
            <li>list item</li>
        </ul>
        <!--New Query-->
    	<h1>Category Title</h1>
        <ul>
        	<li>list item</li>
            <li>list item</li>
            <li>list item</li>
            <li>list item</li>
        </ul>
    </div>
</div>
</body>
</html>

 

The problem you are running into is box level elements.  You technically only need 3 columns and 1 row if you were going to do a table layout.  I would use the above as a reference and swap out as needed.

Link to comment
Share on other sites
janniesekind Newbie

janniesekind

Posted
  • Author
Posted

hey man

 

thank you so so so so so much.

 

Its working now. its 95% of what I wanted.

 

But its working just fine.

 

Thank you again. I cannot express how drained I felt because of frustration and no sleep.

 

Thanx again.

 

You are the first one to assist me in 5 hard days.

 

thumbs up for you

Link to comment
Share on other sites
This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
 Share
Go to topic listing
×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.