Jump to content

Recommended Posts

Hey Guys,

 

I have the below code that will echo a table with a nice box around it. But if I change the code and call the class like

 

<tr class='table_style'>

 

It will not apply the stylesheet settings. ie . . no box around the row. Heres what I am trying..

 

echo "<table  width='700' border='0' cellpadding='0' cellspacing='0'>";

while($row = $result->fetch_assoc())
  {
				echo "
				  
                <tr class='table_style'>
                 
			  <td  width = 46 align='center' valign='middle'><img src=".$camera_image." style= border='1px' width='40' height='40' /></td>
                  <td width = 100 align='left'>". $row['header'] ."</td>
                  <td width = 50 align='left'>" . $row['make'] . "</td>
                  <td width = 50 align='left'>" . $row['county'] . "</td>
                  <td width = 40 align='left'>" . '€' . $row['price'] . "</td>
			  <td width = 40 align='left'><a href=\"view_ad.php?ad_id=". $row['ad_id'] ."\">View Ad</a></td>
			  
                </tr>

            ";
		  


		  }

 

So for each row in the database . . I will loop through and display in its own row with a border around it (Thats what I am trying to achieve)...

 

heres the style sheet snippet

 

.table_style

{

font-family:Arial; font-size:13px; color:#303030;

 

height:55px;

border-bottom-style:solid; border-bottom-color:#D9D9D9; border-bottom-width:1px;

border-top-style:solid; border-top-color:#D9D9D9; border-top-width:1px;

border-left-style:solid; border-left-color:#D9D9D9; border-left-width:1px;

border-right-style:solid; border-right-color:#D9D9D9; border-right-width:1px;

}

Link to comment
https://forums.phpfreaks.com/topic/55293-calling-a-css-class-in-a/
Share on other sites

tr are not the same kind of element to td's they have no visual interpretation on a page and as such are simply place holders for elements - needed so the browser can calculate where groups of elements should be.

 

the solution is to give each td a top and bottom border and give the first td a left border and the last td a rigyht border.

 

many ways to accomplish this... go play and let us know which method you decide on.

Hey,

 

Well .  I played around a little with this. The best option is what you said "the solution is to give each td a top and bottom border and give the first td a left border and the last td a rigyht border."

 

The only problem I am left with is:

 

1. How do I put a 10px; space between the rows in the table? I tried padding and that but I must be doing something wrong.

 

2. I wanted the colour of the border around the tr to change on rollover which I can do fine . . but instead of just highlighting it as one unique border, it also highlights the vertical ones between td data.

well....

 

I find that search results are often best displayed as an unordered list (after all they are simply a list of results).  The issue here is the text text text text bit.

 

that in itself does indeed appear to be tabular data and as such a table is the correct markup.

 

Do you have a link to a live page?

 

seeing it and the type of infomation you are displaying would help deciding what is teh best route to take.

No not at the min,

 

Just running on local.

 

As it stands the only problem I am having is putting the gap between the table rows. I mean I could echo another tr just under each one but the gap is well to big. and padding doesnt seem to do the trick.

 

so in the above example, I have the layout . . but not the space/ gap in between each of the boxes.

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.

×
×
  • 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.