1

I am styling a page that has PHP in the middle that echos out a table. I have the html centered through an external style sheet but the PHP section(where the table is wont center) so I am thinking the best way to style this is for inline css in the php section. any help is appreciated.

// display data in table




echo "<table border='1'  cellpadding='2' class='footable mdl-data-table mdl-js-data-table mdl-data-table--selectable mdl-shadow--4dp full-width'>";

echo "<tr> <th>ID</th> <th>Administration Console</th> <th>Product Version</th> <th>Platform</th> <th>Database</th> <th>Owner</th> <th>Status</th> <th></th> <th></th></tr>";



// loop through results of database query, displaying them in the table

while($row = mysql_fetch_array( $result )) {



// echo out the contents of each row into a table

echo "<tr>";

echo '<th>' . $row['id'] . '</th>';

echo '<td><a href="'.$row['curl'].'">'.$row['curl'].'</a></td>';

echo '<td>' . $row['pversion'] . '</td>';

echo '<td>' . $row['platform'] . '</td>';

echo '<td>' . $row['dversion'] . '</td>';

echo '<td><a href="mailto:'.$row['email'].'">' . $row['email'].'</a></td>';

echo '<td>' . $row['status'] . '</td>';

echo '<td><a href="php/edit.php?id=' . $row['id'] . '">Edit</a></td>';

echo '<td><a onclick="javascript:confirmationDelete($(this));return false;" href="php/delete.php?id=' . $row['id'] . '"onclick="return confirm("Do you want to delete this?")">Delete</a></td>';

echo "</tr>";

}





// close table>

echo "</table>";

?>
MonkeyZeus
  • 20,375
  • 4
  • 36
  • 77
Daniel Murran
  • 95
  • 2
  • 2
  • 7
  • 2
    Why can't you simply style the table with the same external stylesheet? – mayersdesign Mar 27 '17 at 14:27
  • I have an external style that is styling the rest of the page( centering it) but the PHP part(table) is not moving to the center – Daniel Murran Mar 27 '17 at 14:29
  • 1
    If you're writing new code, **_please_ don't use the `mysql_*` functions**. They are old and broken, were deprecated in PHP 5.5 (which is so old it no longer even receives security updates), and completely removed in PHP 7. Use [`PDO`](https://secure.php.net/manual/en/book.pdo.php) or [`mysqli_*`](https://secure.php.net/manual/en/book.mysqli.php) with _prepared statements_ and _parameter binding_ instead. See http://stackoverflow.com/q/12859942/354577 for details. – ChrisGPT was on strike Mar 27 '17 at 14:29
  • The table should be style-able via CSS no problem. Make sure the positioning of your table is within the specificity range of the style sheet. You are confusing one problem to be the result of an unrelated output technique. Either target your table properly or figure out how to write CSS which will do what you need. – MonkeyZeus Mar 27 '17 at 14:31
  • Is there a reason why you use th and td in a tr-tag? As far as I know you need then the scope="row" attribute... But it is years ago, that i used tables-layout on a website. – Oliver Mar 27 '17 at 14:33
  • the page is wrapped with a div where everything else is moving on the page @MonkeyZeus . my css is: #page-wrap { width:80%; margin: 0 auto; } and this moves everything to the center but not the table – Daniel Murran Mar 27 '17 at 14:35
  • `margin: 0 auto` should be applied to the `table` so that it can be centered. Is that what you have? – CodeGodie Mar 27 '17 at 14:40
  • yeah @CodeGodie see above everything on the page including the table is in that #page-wrap div, everything is centered apart from table(which is the php section) – Daniel Murran Mar 27 '17 at 14:42
  • in your above comment i see that `#page-wrap` has the margin, but not the table. You need to apply it to the table as it does not inherit it. – CodeGodie Mar 27 '17 at 14:43

2 Answers2

3

You can use this but all tables will be centered

table {
    margin: 0 auto;
}

or define a class to identify the specific table

table .customClass {
    margin: 0 auto;
}

<table border='1' cellpadding='2' class='customClass footable mdl-data-table mdl-js-data-table mdl-data-table--selectable mdl-shadow--4dp full-width'>

or you can try using align="center"

<table align="center" border='1' cellpadding='2' class='footable mdl-data-table mdl-js-data-table mdl-data-table--selectable mdl-shadow--4dp full-width'>

Hope this might help you.

Eugene van der Merwe
  • 91
  • 6
1

The same style mark in the front will be covered. example:

<style>
    th, td{
        text-align: center;
    }
    th, td{
        text-align: left;
    }
</style>

Then the text would be display from left.

To solve the problem simply, you can try to add these code below all of the css links:

<style>
    th, td{
        text-align: center;
    }
</style>

If it doesn't work, I suggest that you try this :-)

echo '<th style="text-align: center">' . $row['id'] . '</th>';
lifanko lee
  • 46
  • 3