Problème avec CSS drupal

Information importante

En raison d'un grand nombre d'inscriptions de spammers sur notre site, polluant sans relache notre forum, nous suspendons la création de compte via le formulaire de "sign up".

Il est néanmoins toujours possible de devenir adhérent•e en faisant la demande sur cette page, rubrique "Inscription" : https://www.drupal.fr/contact


De plus, le forum est désormais "interdit en écriture". Il n'est plus autorisé d'y écrire un sujet/billet/commentaire.

Pour contacter la communauté, merci de rejoindre le slack "drupalfrance".

Si vous voulez contacter le bureau de l'association, utilisez le formulaire disponible ici, ou envoyez-nous un DM sur twitter.

Submitted by sonia.geret on

Bonjour,

Je rencontre un problème lors de la construction d'une de mes pages sur drupal.

En effet cette page est composée d'un tableau faisant appel à une de mes css (hors drupal)

Ma CSS :

table {
width: 200px;
  border-collapse: collapse;
border: 1px solid #AF2626;
empty-cells: show;
}

td.entete {
  text-align: center;
    font-family: Arial;
    font-size: x-small;
    font-weight: bold;
color: #FFFFFF;
    background-color: #ff6600;
}

td.libelle {
text-align: center;
    font-family: Arial;
    font-size: small;
  padding: 5px;
  border: 1px solid #ff6600;
background-color: #DDDDDD;

td.principal{
position: relative;
    font-family: Arial;
    width: 200px;
  }

Mon code :

<html>

   <head>
       <meta http-equiv="Content-Type" content="text/html;charset=ISO-8859-1" />
        <link rel="stylesheet" href="css/styles.css" type="text/css" />
        <link rel="stylesheet" type="text/css" href="drupal-5.1/css/tableau.css">
      <title>Intranet </title>
   </head>
 
   <body>
  

      <div class = "principal">
      <table >
     <tr>
         <th class = "entete" colspan="2"><img src="img/logo_orange.gif" border= 0 /><img src="img/logo_intranet.gif" border= 0 /><img src="img/logo_ft.gif" border= 0 /><br><br><b>Plateau Unix</b></th>
       </tr>
       
      
           <tr>
             <td class="entete"><FONT size=3><b>Intitulé</b></font><br></td>
                <td class="entete"><FONT size=3><b>Lien</b></font><br></td>
            </tr>
            <tr>
                <td class='libelle'>PEM<br></td>
               <td class='libelle'><a href="P:\Astreintes_PEM"><img src="img/fleche_orange.gif" border= 0 /> </a>  <br></td>
            </tr>
           
           <tr>
         <td class='libelle'>RMH</b></td>
          <td class='libelle'><a href="P:\Astreintes_RHM"><img src="img/fleche_orange.gif" border = 0 /> <br></td>
          </tr>
           
           <tr>
            <td class='libelle'>PREV<br></td>
         <td class='libelle'> <a href="P:\Astreintes_PREV"><img src="img/fleche_orange.gif" border = 0 /> </a> <br>
         </td> </tr>
            <tr>
           
           <td class='libelle'>PLAR <br></td>
            <td class='libelle'> <a href="P:\Astreintes_PLAR"><img src="img/fleche_orange.gif" border = 0 /> </a><br></td> <br>
            </tr>
           
           <tr>
            <td class='libelle'>OPER </B><br></td>
          <td class='libelle'> <a href="P:\Astreintes_OPER"><img src="img/fleche_orange.gif" border = 0 /> </a><br></td>
          </tr>
           
          
       </table>
            
       </div>
      
   </body>

</html>

Lorsque je place ce code dans ma "content" la configuration esthétique de mon site (theme aurora) saute.
Le problème vient que le paramètre de mon "width: 200px;" n'est pas pris en compte, il ajuste mon tableau à 100% de ma page.
J'ai donc fait une recherche sur les 5 css appelées dans le code source de la visualisation de ma content, et la à part une migraine j'ai rien trouvé d'autre (lol).

Je me suis donc dis je vais mettre tous le paramètre de ma css dans mon code :

<html>
<head>
<title>Intranet </title>
</head>
<body>
<table border="2" bordercolor="#999999" cellspacing="0,5" cellpadding="15">

     <tr>
         <th colspan="2"><img src="img/logo_orange.gif" border= 0 /><img src="img/logo_intranet.gif" border= 0 /><img src="img/logo_ft.gif" border= 0 /><br><br><b>Plateau Unix</b></th>
      </tr>
       
       <tr>
         <td  bgcolor="#ff6600" align="center" width="150px"><FONT face = "arial" size=3 color="#FFFFFF"><b>Intitulé</b></font><br></td>
            <td  bgcolor="#ff6600" align="center" width="80px"><FONT face = "arial" size=3 color="#FFFFFF"><b>Lien</b></font><br></td>
     </tr>
       
               <tr>
                <td bgcolor="#DDDDDD" align="center"> <FONT face = "arial" size=2 color="#ff6600"><b><br>PEM<br><b></td>
                <td bgcolor="#DDDDDD" align="center"> <a href="http://intranet-drupal-5.1/index.php?q=PEM"><img src="img/fleche_orange.gif" border= 0 /> </a>  <br></td>
              </tr>
               
               <tr>
                <td bgcolor="#DDDDDD" align="center"> <FONT face = "arial" size=2 color="#ff6600"><b><br>RHM<br><b></td>
                <td bgcolor="#DDDDDD" align="center"><a href=" http://intranet-drupal-5.1/index.php?q=RHM"><img src="img/fleche_orange.gif" border= 0 /> </a><br></td>
                </tr>
               
               <tr>
                <td bgcolor="#DDDDDD" align="center"> <FONT face = "arial" size=2 color="#ff6600"><b><br>PREVIENSNOO<br><b></td>
                <td bgcolor="#DDDDDD" align="center"> <a href="http://intranet-drupal-5.1/index.php?q=PREVIENSNOO"><img src="img/fleche_orange.gif" border = 0 /> </a> <br></td>
              </tr>
               
               <tr>
                <td bgcolor="#DDDDDD" align="center"> <FONT face = "arial" size=2 color="#ff6600"><b><br> PLATINE<br><b></td>
               <td bgcolor="#DDDDDD" align="center"><a href="http://intranet-drupal-5.1/index.php?q=PLATINE"><img src="img/fleche_orange.gif" border = 0 /> </a><br></td> <br>
              </tr>
               
               <tr>
                <td bgcolor="#DDDDDD" align="center"> <FONT face = "arial" size=2 color="#ff6600"><b><br> PEGD - FEGP - PEXRR<br><b></td>
               <td bgcolor="#DDDDDD" align="center"> <a href="http://intranet-drupal-5.1/index.php?q=PEGD_FEGP_PEXRR"><img src="img/fleche_orange.gif" border = 0 /> </a><br></td>
               </tr>
               
               <tr>
                <td bgcolor="#DDDDDD" align="center"> <FONT face = "arial" size=2 color="#ff6600"><b><br> OPERATION<br><b></td>
             <td bgcolor="#DDDDDD" align="center"><a href="http://intranet-drupal-5.1/index.php?q=AUTRES"><img src="img/fleche_orange.gif" border = 0 /><br></td>
                </tr>
               
               <tr>
                <td bgcolor="#DDDDDD" align="center"> <FONT face = "arial" size=2 color="#ff6600"><b><br> AUTRES<br><b></td>
                <td bgcolor="#DDDDDD" align="center"><a href="http://intranet-drupal-5.1/index.php?q=AUTRES"><img src="img/fleche_orange.gif" border = 0 /> <br></td>
               </tr>
                               

  </body>

</html>

Mais le problème reste présent, la css drupal a la priorité sur les paramètres de mon code.
Me revoila au point de départ avec une config toute cassée a la visualisation de mon tableau.

Si vous avez la solution, vous me ferez économiser des aspirines pour demain, merci.

Sonia

Forum : 
Support général
Version de Drupal : 
5.x

Soumis par tostinni le 4 Décembre, 2007 - 19:00

AMHA il faut que tu specifies une classes pour ta table justement pour qu'elle prenne en compte ton CSS et non pas celui de Drupal.
Donc un truc du genre

<body>
<table border="2" bordercolor="#999999" cellspacing="0,5" cellpadding="15" class="ma_table">
<tr>
...

Et ensuite le CSS:

table.ma_table {
width: 200px;
border-collapse: collapse;
border: 1px solid #AF2626;
empty-cells: show;
}

Car t'as fait ca pour les balises th et td mais pas pour la table ;)