Partage

Problème dans mon code css ?

11 avril 2006 à 21:22:34

Bonjour,

J'ai une page index.php dans laquel grace aux include j'insère mon menu : menu.php
Mon menu est constitué d'un tableau mon problème est que lorsque que je veus mettre un tableau dans le corps de ma page il prend les propriétés css du menu ?

Je voudrais donc savoir comment je pourrais faire ? Je penser mettre mon code css dans la page menu.php mais je ne sais pas si sa marche et je ne sais pas faire ?

Merci beaucoup d'avance

Voila ma page menu.php :

<div>

<table>
<tr>
<th>Sommaire :</th>
</tr>
<tr>
<td><a href="http://refblogsite.free.fr/index.php">Retour au sommaire</a></td>
</tr>

<tr>
<th>S'inscrire :</th>
</tr>
<tr>
<td><a href="http://refblogsite.free.fr/avissite.php">Proposer un site</a></td>
</tr>

<tr>
<th>Les catégories :</th>
</tr>
<tr>
<td><a href="http://refblogsite.free.fr/categories.php">Voir tous les sites</a></td>
</tr>

<tr>
<th>Divers :</th>
</tr>
<tr>
<td><a href="http://refblogsite.free.fr/livreor.php">Livre d'or</a></td>
</tr>

<tr>
<th></th>
</tr>
<tr>
<td><a href="http://refblogsite.free.fr/lienspublicitaire.php">Liens publicitaire</a>
</tr>

<tr>
<th></th>
</tr>
<tr>
<td><a href="http://refblogsite.free.fr/mecontacter.php">Me contacter</a>

</td>
</tr>

</table>

</div>

Et voila mon code css que je voudrais insérer dans la page menu.php pour que ce code css agisse que sur le menu :

strong
strong
{
color:#000000;
}

h3
{
color: red;
text-decoration : underline;
font-size : 1.9em;
}

h5
{
color: red;
font-size : 1.8em;
}

h2
{
color: red;
font-size : 1.2em;
}

input, textarea
{
font-family: "Cosmic Ms", Arial;
}

input:focus, textarea:focus /
{
background-color: #ff2909;
}

label
{
color: red;
}

fieldset
{
margin-bottom: 15px;
background-color: red;
}

a:hover /* Quand le visiteur pointe sur le lien */
{

text-decoration : underline;
color : red;

}

a
{
text-decoration: nunderline;
color: #313E82;
}

p
{
color:#313E82;
font-size : 1em;
font-family: Times New Roman;

}

body
{
width: 1000px;
height: 90px;
margin: auto;
margin-top: 20px;
margin-bottom: 20px;

background-color: #D5DDFD;

}

table
{
border : none ;
border-collapse: collapse; /* Colle les bordures entre elles */
}

th /* Les cellules d'en-tête */
{
background-color: #6A7AC2;
color: white;
font-size: 1.1em;
font-family: Times New Roman;
}

td /* Les cellules normales */
{

background-color:#ADB8E4 ;
font-family: Times New Roman;
border : none;
text-align: center; /* Tous les textes des cellules seront centrés*/
padding: 5px; /* Petite marge intérieure aux cellules pour éviter que le texte touche les bordures */
}

table
{
border-collapse: collapse; /* Les bordures du tableau seront collées (plus joli) */
color: yellow;
font-family: Times New Roman;
text-align: center;
float: left;
width: 140px
}

/* Le corps de la page */

#corps
{
margin-left: 140px;

padding: 5px;
background-color: white;

}

#menu
{
background-color:#D5DDFD;
}

#en_tete
{
width: 760px;
height: 100px;
background-image: url("images/banniere.png");
background-repeat: no-repeat;

}

/* Le pied de page (qui se trouve tout en bas, en général pour les copyrights) */

#pied_de_page
{
padding: 3px;
text-align: center;
color: #5a5ec8;
background-color :#6A7AC2;

}

Merci

strucky

11 avril 2006 à 22:03:51

Salut,

Tu mets un id ou une classe sur la table de ton menu tout simplement.

#menu
{
border : none ;
border-collapse: collapse; /* Colle les bordures entre elles */
color: yellow;
font-family: Times New Roman;
text-align: center;
float: left;
width: 140px
}

#menu th /* Les cellules d'en-tête */
{
background-color: #6A7AC2;
color: white;
font-size: 1.1em;
font-family: Times New Roman;
}

#menu td /* Les cellules normales */
{

background-color:#ADB8E4 ;
font-family: Times New Roman;
border : none;
text-align: center; /* Tous les textes des cellules seront centrés*/
padding: 5px; /* Petite marge intérieure aux cellules pour éviter que le texte touche les bordures */
}

Riko

11 avril 2006 à 22:05:18

strucky m'est passer devant.

NarTy

11 avril 2006 à 22:05:41

Explication :

Tout simplement , dans ton css, tu mets table,td,th ...
Alors tous tes tableaux seront affectés par ces styles !

Résolution :

Donc , tu as plusieurs possibilités ! Je vais te donner la plus simple et la plus rapide ! ( fin je pense :euh:

)
Dans ton fichier menu.php :

<table class="menu">
<tr>
<th>Sommaire :</th>
</tr>
<tr>
<td><a href="http://refblogsite.free.fr/index.php">Retour au sommaire</a></td>
</tr>

<tr>
</table>

et dans donc css:

/* Tu rajoutes 'menu' devant chaque style de ton menu */
menu table
{
border : none ;
border-collapse: collapse; /* Colle les bordures entre elles */
}

menu th /* Les cellules d'en-tête */
{
background-color: #6A7AC2;
color: white;
font-size: 1.1em;
font-family: Times New Roman;
}

menu td /* Les cellules normales */
{

background-color:#ADB8E4 ;
font-family: Times New Roman;
border : none;
text-align: center; /* Tous les textes des cellules seront centrés*/
padding: 5px; /* Petite marge intérieure aux cellules pour éviter que le texte touche les bordures */
/* ET POUR LES AUTRES TABLEAUX */

table
{
border : none ;
border-collapse: collapse; /* Colle les bordures entre elles */
}

th /* Les cellules d'en-tête */
{
background-color: #6A7AC2;
color: white;
font-size: 1.1em;
font-family: Times New Roman;
}

td /* Les cellules normales */
{

background-color:#ADB8E4 ;
font-family: Times New Roman;
border : none;
text-align: center; /* Tous les textes des cellules seront centrés*/
padding: 5px; /* Petite marge intérieure aux cellules pour éviter que le texte touche les bordures */
}
}

En ésperant t'avoir aidé, @+

toony442

11 avril 2006 à 22:10:15

Ta méthode me paraissait trop bien mais elle ne marche pas voici mes codes, avec ces codes mon menu n'est pas affiché correctement :

menu.php :

<div>

<table>
<tr>
<th>Sommaire :</th>
</tr>
<tr>
<td><a href="http://refblogsite.free.fr/index.php">Retour au sommaire</a></td>
</tr>

   <tr>
<th>S'inscrire :</th>
</tr>
<tr>
<td><a href="http://refblogsite.free.fr/avissite.php">Proposer un site</a></td>
</tr>

   <tr>
<th>Les catégories :</th>
</tr>
<tr>
<td><a href="http://refblogsite.free.fr/categories.php">Voir tous les sites</a></td>
</tr>

   <tr>
<th>Divers :</th>
</tr>
<tr>
<td><a href="http://refblogsite.free.fr/livreor.php">Livre d'or</a></td>
</tr>

<tr>
<th></th>
</tr>
<tr>
<td><a href="http://refblogsite.free.fr/lienspublicitaire.php">Liens publicitaire</a>
</tr>

   <tr>
<th></th>
</tr>
<tr>
<td><a href="http://refblogsite.free.fr/mecontacter.php">Me contacter</a>

   </td>
</tr>

</table>

</div>

Et ma page css :

strong
{
color:#000000;
}

h3
{
color: red;
text-decoration : underline;
font-size : 1.9em;
}

h5
{
color: red;
font-size : 1.8em;
}

h2
{
color: red;
font-size : 1.2em;
}

input, textarea
{
font-family: "Cosmic Ms", Arial;
}

input:focus, textarea:focus /
{
background-color: #ff2909;
}

label
{
color: red;
}

fieldset
{
margin-bottom: 15px;
background-color: red;
}

a:hover /* Quand le visiteur pointe sur le lien */
{

text-decoration : underline;
color : red;

}

a
{
text-decoration: nunderline;
color: #313E82;
}

p
{
color:#313E82;
font-size : 1em;
font-family: Times New Roman;

}

body
{
width: 1000px;
height: 90px;
margin: auto;
margin-top: 20px;
margin-bottom: 20px;

background-color: #D5DDFD;

}

menu th /* Les cellules d'en-tête */
{
background-color: #6A7AC2;
color: white;
font-size: 1.1em;
font-family: Times New Roman;
}

menu td /* Les cellules normales */
{

background-color:#ADB8E4 ;
font-family: Times New Roman;
border : none;
text-align: center; /* Tous les textes des cellules seront centrés*/
padding: 5px; /* Petite marge intérieure aux cellules pour éviter que le texte touche les bordures */
}

menu table
{
border-collapse: collapse; /* Les bordures du tableau seront collées (plus joli) */
color: yellow;
font-family: Times New Roman;
text-align: center;
float: left;
width: 140px;
border : none ;
border-collapse: collapse; /* Colle les bordures entre elles */
}

/* Le corps de la page */

#corps
{
margin-left: 140px;

padding: 5px;
background-color: white;

}

#menu
{
background-color:#D5DDFD;
}

#en_tete
{
width: 760px;
height: 100px;
background-image: url("images/banniere.png");
background-repeat: no-repeat;

}

/* Le pied de page (qui se trouve tout en bas, en général pour les copyrights) */

#pied_de_page
{
padding: 3px;
text-align: center;
color: #5a5ec8;
background-color :#6A7AC2;

}

Merci bcp

Riko

11 avril 2006 à 22:13:57

Oups grosse con----ie.
Désolé!!

toony442

11 avril 2006 à 22:19:18

Pourquoi gross con...ie ?

Personne aurait la réponse a ma question ?

Riko

11 avril 2006 à 22:22:23

Parce que je t'ai envoyé une mauvaise réponse que j'ai édité.
Rien qui concerne ce post.

Ceci étant je ne vois pas de problème dans le code que tu présente ci dessus.

toony442

11 avril 2006 à 22:28:18

Ben le deuxième code que je montre la fonction menu table devrait agir sur le tableau qui est dans la page menu.php or ce n'est pas le cas cette fonction n'agit sur plus rien si je met menu devant ?

Tu ne sais pas faire pour insérer un code css dans une page .php ?

Merci

Riko

11 avril 2006 à 22:35:14

Essaies plutot ça

<div class="menu">

<table>
<tr>
<th>Sommaire :</th>
</tr>
<tr>
<td><a href="http://refblogsite.free.fr/index.php">Retour au sommaire</a></td>
</tr>

<tr>
<th>S'inscrire :</th>
</tr>
<tr>
<td><a href="http://refblogsite.free.fr/avissite.php">Proposer un site</a></td>
</tr>

<tr>
<th>Les catégories :</th>
</tr>
<tr>
<td><a href="http://refblogsite.free.fr/categories.php">Voir tous les sites</a></td>
</tr>

<tr>
<th>Divers :</th>
</tr>
<tr>
<td><a href="http://refblogsite.free.fr/livreor.php">Livre d'or</a></td>
</tr>

<tr>
<th></th>
</tr>
<tr>
<td><a href="http://refblogsite.free.fr/lienspublicitaire.php">Liens publicitaire</a>
</tr>

<tr>
<th></th>
</tr>
<tr>
<td><a href="http://refblogsite.free.fr/mecontacter.php">Me contacter</a>

</td>
</tr>

</table>

</div>

Dans ton code CSS tu rajoute un "." devant table, tr, ect....
Désolé je n'y connais rien du tout en php.

toony442

11 avril 2006 à 22:39:08

J'ai mis ton codes mais sa ne change absolument rien ?
Merci beaucoup d'avance

Voila les codes que j'ai mis :

menu.php :

et voila mon code css :

strong
{
color:#000000;
}

h3
{
color: red;
text-decoration : underline;
font-size : 1.9em;
}

h5
{
color: red;
font-size : 1.8em;
}

h2
{
color: red;
font-size : 1.2em;
}

input, textarea
{
font-family: "Cosmic Ms", Arial;
}

input:focus, textarea:focus /
{
background-color: #ff2909;
}

label
{
color: red;
}

fieldset
{
margin-bottom: 15px;
background-color: red;
}

a:hover /* Quand le visiteur pointe sur le lien */
{

text-decoration : underline;
color : red;

}

a
{
text-decoration: nunderline;
color: #313E82;
}

p
{
color:#313E82;
font-size : 1em;
font-family: Times New Roman;

}

body
{
width: 1000px;
height: 90px;
margin: auto;
margin-top: 20px;
margin-bottom: 20px;

background-color: #D5DDFD;

}

.th /* Les cellules d'en-tête */
{
background-color: #6A7AC2;
color: white;
font-size: 1.1em;
font-family: Times New Roman;
}

.td /* Les cellules normales */
{

background-color:#ADB8E4 ;
font-family: Times New Roman;
border : none;
text-align: center; /* Tous les textes des cellules seront centrés*/
padding: 5px; /* Petite marge intérieure aux cellules pour éviter que le texte touche les bordures */
}

.table
{
border-collapse: collapse; /* Les bordures du tableau seront collées (plus joli) */
color: yellow;
font-family: Times New Roman;
text-align: center;
float: left;
width: 140px;
border : none ;
border-collapse: collapse; /* Colle les bordures entre elles */
}

/* Le corps de la page */

#corps
{
margin-left: 140px;

padding: 5px;
background-color: white;

}

#menu
{
background-color:#D5DDFD;
}

#en_tete
{
width: 760px;
height: 100px;
background-image: url("images/banniere.png");
background-repeat: no-repeat;

}

/* Le pied de page (qui se trouve tout en bas, en général pour les copyrights) */

#pied_de_page
{
padding: 3px;
text-align: center;
color: #5a5ec8;
background-color :#6A7AC2;

}

Riko

11 avril 2006 à 22:42:33

Gardes le dernier code html et tu mets

strong
{
color:#000000;
}

h3
{
color: red;
text-decoration : underline;
font-size : 1.9em;
}

h5
{
color: red;
font-size : 1.8em;
}

h2
{
color: red;
font-size : 1.2em;
}

input, textarea
{
font-family: "Cosmic Ms", Arial;
}

input:focus, textarea:focus /
{
background-color: #ff2909;
}

label
{
color: red;
}

fieldset
{
margin-bottom: 15px;
background-color: red;
}

a:hover /* Quand le visiteur pointe sur le lien */
{

text-decoration : underline;
color : red;

}

a
{
text-decoration: nunderline;
color: #313E82;
}

p
{
color:#313E82;
font-size : 1em;
font-family: Times New Roman;

}

body
{
width: 1000px;
height: 90px;
margin: auto;
margin-top: 20px;
margin-bottom: 20px;

background-color: #D5DDFD;

}

.menu th /* Les cellules d'en-tête */
{
background-color: #6A7AC2;
color: white;
font-size: 1.1em;
font-family: Times New Roman;
}

.menu td /* Les cellules normales */
{

background-color:#ADB8E4 ;
font-family: Times New Roman;
border : none;
text-align: center; /* Tous les textes des cellules seront centrés*/
padding: 5px; /* Petite marge intérieure aux cellules pour éviter que le texte touche les bordures */
}

.menu table
{
border-collapse: collapse; /* Les bordures du tableau seront collées (plus joli) */
color: yellow;
font-family: Times New Roman;
text-align: center;
float: left;
width: 140px;
border : none ;
border-collapse: collapse; /* Colle les bordures entre elles */
}

/* Le corps de la page */

#corps
{
margin-left: 140px;

padding: 5px;
background-color: white;

}

#menu
{
background-color:#D5DDFD;
}

#en_tete
{
width: 760px;
height: 100px;
background-image: url("images/banniere.png");
background-repeat: no-repeat;

}

/* Le pied de page (qui se trouve tout en bas, en général pour les copyrights) */

#pied_de_page
{
padding: 3px;
text-align: center;
color: #5a5ec8;
background-color :#6A7AC2;

}

toony442

11 avril 2006 à 22:51:55

Merci bcp de ton aide sa marche mais alors maintenant je peus mettre des tableaux dans le corps de ma page et ce code n'aura aucun effet ?

Merci bcpbcp

Riko

11 avril 2006 à 22:55:38

Je pense que tu peux mettre d'autre tableaux dans ta page menu et celle dans laquelle tu l'insères, dans la mesure où tu places ton nouveau hors de ta div ".menu".

Par contre je te conseille de faire le design de ton site sans tableau.
Voir ici : http://css.alsacreations.com/Faire-une-mise-en-page-sans-tableaux/Construire-un-site-sans-tableaux

toony442

12 avril 2006 à 11:20:27

D'accord merci beaucoup de ton aide