Problème de style sur les bordures d'un tableau

Répondre
Citer ce message
jackbocar
le 16/07/2008 à 13:20
jackbocar
<!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>
<title>Tableau PDO</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style type="text/css">
BODY {background: #f1f1f1;}
IMG {float: left;}
BODY, P, IMG {font-family: Arial, Helvetica, sans-serif;font-size: 10pt;margin: 0.5em;text-align:justify;}
.red {color: red;}
.cellule {color: #0C034F;text-align: justify;border: solid 1px #a0522d;}
.cadre {border: solid 1px #a0522d;background-color:#ffffff;}
.Lnav {text-decoration: none;font-weight: bold;color:#23698B;font-size : 10pt;}
.Lnav:hover {text-decoration: underline;font-weight: bold;color:#990000;font-size : 10pt;}
</style>
</head>

<body>

Bonjour,

J'ai un tableau en PDO, il fonctionne parfaitement bien, mon seul problème est les STYLES du cadre et des cellules. Ils sont pour une part épais et pour une autre fin ?

Comment régler ce problème ?

Merci de votre aide

Jack Bocar


  1. <?php

  3. /*------------------------------------------------*/
  4. /*
  5. /*   NE RIEN CHANGER ICI                          */
  6. /*
  7. /*------------------------------------------------*/
  8. 	class Connexion extends PDO{
  9. 		private $debug;
  10. /*---  constructeur ne rien changer ----*/

  12. 	    function __construct($user,$mdp,$bdd,$host='localhost'){

  14. 	    	$this->debug=false;
  15. 	        try{
  16. 				parent::__construct('mysql:host='.$host.';dbname='.$bdd,$user,$mdp);
  17. 			} catch(PDOEXCEPTION $e){
  18. 			    die ('Erreur : '.$e->getMessage() );
  19. 			}
  20. 			$this->exec('SET CHARACTER SET 8859-1');
  21. 	    }
  22. 	    function modeDebug(){
  23. 	    	$this->debug=true;
  24. 		}
  25. /*--- execute une requete sql du type insert, delete ou update ---*/

  27. 	    function exec($requete){
  28.             $resultat=parent::exec($requete);
  29.             if($resultat===FALSE and $this->debug){
  30.                 var_dump($resultat);
  31. 				var_dump(parent::errorInfo());
  32.             }else{
  33.             	return $resultat;
  34.             }
  35. 	    }
  36. /*--- execute une requete du type select ---*/

  38. 	    function query($requete){
  39. 	    	$resultat=parent::query($requete);
  40.             if($resultat===FALSE and $this->debug){
  41.                 var_dump($this->errorInfo());
  42. 				var_dump(parent::errorInfo());
  43.             	$resultat->closeCursor();
  44.             }else{
  45.             	return $resultat;
  46.             }
  47. 	    }
  48. /*--- return : false si aucune valeur trouvee ----*/

  50. 	    function querySimple($select,$table,$where='',$groupBy='',$ordre='',$limit='',$defaut=false){
  51. 	    	$requete='select '.$select.
  52. 	    			' from '.$table;
  53. 	    	if($where!=''){
  54. 	    		$requete.=' where '.$where;
  55. 	    	}
  56. 	    	if($groupBy!=''){
  57. 	    		$requete.=' group by '.$groupBy;
  58. 	    	}

  60. 			if($ordre!=''){
  61. 				$requete.=' order by '.$ordre;	    		
  62. 	    	}
  63. 	    	if($limit!=''){
  64. 	    	    $requete.=' limit '.$limit;
  65. 	    	}
  66. 			$resultat=$this->query($requete);
  67. 	    	$resultat=$resultat->fetchAll(PDO::FETCH_BOTH);
  68. 	    	if(isset($resultat[0][0])){
  69. 	    		return $resultat[0][0];
  70. 	    	}else{
  71. 	    		return $defaut;
  72. 	    	}
  73. 	    }
  74. /*--- renvoie un tableau associatif contenant le résultat de la requete -----*/

  76. 	    function requete2tableau($requete){
  77. 	    	$resultat=$this->query($requete);
  78. 			if($resultat===false AND $this->debug){
  79. 				echo $requete;
  80. 			};			
  81. 			return $resultat->fetchAll(PDO::FETCH_ASSOC);
  82. 	    }
  83. /*---renvoie un tableau html contenant le résultat de la requete---*/

  85. /*----ON PEUT MODIFFIER LA TABLE SEULEMENT ----*/

  87.      		function requete2html($requete,$border=0,$enteteColonne=true){
  88. 		    $resultat=$this->query($requete);
  89. 			$texte='';
  90. 			$texte.= '<center><table width="90%" cellpadding="0" cellspacing="0" border="'.$border.'" class="cadre">';
  91. 			if($enteteColonne){
  92. 				$texte.= '<tr valign="top">';
  93. 				for($i=0;$i<$resultat->columnCount();$i++){
  94. 					$col=$resultat->getColumnMeta($i);
  95. 					$texte.= '<th class="red">'.$col['name'].'</th>';
  96. 				}
  97. 				$texte.= '</tr>';
  98. 			}
  99. 			$resultat->setFetchMode(PDO::FETCH_NUM);
  100. 			foreach($resultat as $ligne){
  101. 			    $texte.= '<tr valign="top">';
  102. 				foreach($ligne as $valeur){
  103. 					$texte.= '<td class="cellule"><p>'.nl2br($valeur).'</p></td>';
  104. 				}
  105. 				$texte.= '</tr>';

  107. /*-- espace vide entre chaque tableau ----*/

  109. $texte.='<tr><td>&nbsp;</td></tr>';

  111. /*---ON PEUT MODIFIER LES ARGUMENTS SELECT ---*/

  113. 			}
  114. 			$resultat->closeCursor();
  115. 			$texte.='</table><br /><a href="#" class="Lnav">Top</a></center>';
  116. 			return $texte;
  117. 	    }
  118. 	}
  119. 	$connexion=new Connexion('LOGIN','PASSWORD','BASE');
  120. 	$connexion->modeDebug();
  121. 	echo $connexion->requete2html('select id,Nouvelles as Nouvelles from tableau_1 ORDER BY id DESC',1);
  122. 	

  124. /*-
  125. ID, NEWS, INFO, OU TOUT AUTRE SUIVANT LA TABLE ON PEUT AUSSI AJOUTER DES ARGUMENTS 
  126. -*/
  127. 	?>



  131. <br />
  132. <a href="tableau_2.php" class="Lnav">Tableau 2</a> &nbsp; <a href="tableau_3.php" class="Lnav">Tableau 3</a> &nbsp; <a href="tableau_4.php" class="Lnav">Tableau 4</a>
  133. <br /><br />
  134. </body>
  135. </html>


--
-- Structure de la table `tableau_1`
--

CREATE TABLE `tableau_1` (
`id` int(11) NOT NULL auto_increment,
`Nouvelles` text NOT NULL,
PRIMARY KEY (`id`)
) ENGINE=InnoDB DEFAULT CHARSET=latin1 ;
Citer ce message
LA GLOBULE
le 16/07/2008 à 13:29
LA GLOBULE
Pourquoi ne pas avoir posté dans le forum html / css pour un tel problème ?

Sinon, tu n'aurais pas des cellules vides par moment ?
Si oui, regarde du côté de la propriété empty-cells.
Citer ce message
jackbocar
le 16/07/2008 à 13:36
jackbocar
Bonjour,

Désolé, par habitude de poster dans le forum PHP.

Non, je n'ai pas de cellules vide, simplement elles n'ont pas la même épaisseur ?

Jack Bocar
Citer ce message
LA GLOBULE
le 16/07/2008 à 14:08
LA GLOBULE
Tu ne pourrais pas nous donner le HTML gé néré de ta page plutot que le PHP ? Ca serait plus simple pour t'aider.
Citer ce message
jackbocar
le 16/07/2008 à 15:57
jackbocar
J'ai supprimé les balises <TH> et les ai remplacées par <TD>.
J'ai supprimé la fonction $border et l'ai remplacé par border="0"
J'ai toujours comme un double border sur les cellules côté gauche et droit à l'intérieur du cadre

  1. <style type="text/css">
  2. BODY {
  3. background: #f1f1f1;
  4. }

  6. IMG { 
  7. float: left 
  8. }

  10. BODY, P, IMG { 
  11. font-family: Arial, Helvetica, sans-serif;
  12. font-size: 10pt;
  13. margin: 0.5em; 
  14. text-align:justify; 
  15. }
  16. .red {
  17. 	font-family: Arial, Helvetica, sans-serif;
  18. font-size: 12pt;
  19.   color: red;
  20.   font-weight: bold; 
  21.   text-align:center;
  22. }
  23. .cellule {
  24. color: #0C034F;
  25. text-align: justify;
  26. border: solid 1px #a0522d;
  27. }
  28. .cadre {
  29. border: solid 1px #a0522d;
  30. background-color:#ffffff;
  31. }

  33. .Lnav {
  34. text-decoration: none;
  35. font-weight: bold; 
  36. color:#23698B; 
  37. font-size : 10pt;
  38. }

  40. .Lnav:hover {
  41. text-decoration: underline;
  42. font-weight: bold; 
  43. color:#990000;
  44. font-size : 10pt;
  45. }

  47. </style>
  48.  </head>

  50.  <body>
  51. <center>
  52. <table width="90%" cellpadding="0" cellspacing="0" border="0" class="cadre">
  53. <tr valign="top">
  54. <td class="red">id</td>
  55. <td class="red">Nouvelles</td>
  56. </tr>
  57. <tr valign="top">
  58. <td class="cellule"><p>4</p>
  59. </td>
  60. <td class="cellule"><p>Test du tableau et des styles des cadres.</p>
  61. </td>
  62. </tr>
  63. <tr>
  64. <td>&nbsp;</td>
  65. </tr>
  66. <tr valign="top">
  67. <td class="cellule"><p>3</p>
  68. </td>
  69. <td class="cellule"><p>Test du tableau et des styles des cadres.</p></td>
  70. </tr>
  71. <tr>
  72. <td>&nbsp;</td>
  73. </tr>
  74. <tr valign="top">
  75. <td class="cellule"><p>2</p>
  76. </td>
  77. <td class="cellule"><p>Test du tableau et des styles des cadres.</p></td>
  78. </tr>
  79. <tr>
  80. <td>&nbsp;</td>
  81. </tr>
  82. <tr valign="top">
  83. <td class="cellule"><p>1</p>
  84. </td>
  85. <td class="cellule"><p>Test du tableau et des styles des cadres.</p></td>
  86. </tr>
  87. <tr>
  88. <td>&nbsp;</td>
  89. </tr>
  90. </table>
  91. <br />
  92. <a href="#" class="Lnav">Top</a>
  93. </center>
Citer ce message
jackbocar
le 16/07/2008 à 16:08
jackbocar
J'ai trouvé une solution, en supprimant :


  1. .cellule {
  2. color: #0C034F;
  3. text-align: justify;
  4. border: solid 1px #a0522d;
  5. }



Et en remplaçant par : 

  1. .cellule {
  2. color: #0C034F;
  3. text-align: justify;
  4. border-top: solid 1px #a0522d;
  5. border-bottom: solid 1px #a0522d;
  6. border-right: solid 1px #a0522d;
  7. }



Il ne me reste plus qu'un double border à l'intérieur et du côté droit du tableau
Répondre

Ecrire un message

Votre message vient d'être créé avec succès.
LoadingChargement en cours