Bonjour,
Je fais mon premier site et naturelement il y a des choses qui ne vont pas et je ne sais pas comment y remedier ^^
Je vous remercie d´avance.

Donc en premier, j´aimerais centrer mon header.
Voici les codes :

CSS

1. en_tete

{
width: 760px;
height: 140px;
background-image: url("bann.png");
background-repeat: no-repeat;
margin-bottom: 10px;
margin: auto;
}

xHTML
<div id="en_tete">
<!-- Ici je mets ma bann :p -->
</div>

Mais malheuresement, le margin:auto ne marche pas...
J´ai déjà rechercher sur le forum, j´ai tout essayer et ça marche pas xD
Je voudrais garder l´url de l´image dans le CSS.

Deuxièmement
J´aimerais bien mettre des "module" à côté de mon corps.
J´ai déjà mis une marge à mon corps pour qu´il y ai de la place à gauche, et maintenant j´aimerais bien mettre des div à gauche ^^
beaucoup pour votre aide !

margin-bottom: 10px;
margin: auto;

deviendrait

margin: auto auto 10px auto;

Mais je ne vois pas pourquoi ça ne fonctionnerait pas.

Pour tes modules, il faut voir comme tu as codé le reste mais j´aurais tendance à dire d´utiliser des float:left

Pour centrer j´ai essayer mais ça me marche pas...

Pour les modules je vais essayer, merci !

Et puis sinon une autre question :
Je voudrais que mes liens hover soient soulignés et lignés au dessus.
Pour ça dans mon CSS j´ai mis ça :

1. pied_de_page a:hover

{
color: #ff4500;
text-decoration: overline;
text-decoration: underline;

}

Mais ça marche pas...

Quel navigateur utilises-tu

Tu ne peux pas définir 2 text-décoration, le second annulant le premier.

J´utilise FireFox.

Alors comment je pourrais fairer pour avoir souligné et lignée du dessus ?

Avec des bordures et pas des text-decoration.

A tester : text-decoration: underline overline;

deepblue je ne penses pas que ça fonctionne.
J´avais déjà testé la solution de GetElementById, et je pense que c´est la seule solution.

http://www.series-sources.com/simon/under.html

Autant pour moi

Héhé merci beaucoup à tous ça marche pour les lignes !

Maintenant je vais essayer les "modules".

J´ai réussi à mettre mon module.

Mais maintenant j´ai encore d´autre problèmes xD

Donc en fait j´avais juste mis ma barre de menu dans le CSS (l´image avec tous les boutons dedans).

Maintenant je l´ai ai tous coupés pour pouvoir cliquer sur un bouton du menu et acceder à la page qui correspond.
Je me suis dis que ça marchait pas dans le CSS, donc j´ai insérer toutes mes images dans le xHTML.
Voici ce que ça donne :

<div id="menu">
<div id="news"><a href="accueil.html"><img src="news.png" alt="Bouton News" /></a></div>
<div id="groupe"><a href="agroupe.html"><img src="groupe.png" alt="Bouton groupe" /></a></div>
<div id="bio"><a href="bio.html"><img src="bio.png" alt="Bouton Bio" /></a></div>
<div id="disco"><a href="disco.html"><img src="disco.png" alt="Bouton Disco" /></a></div>
<div id="concerts"><a href="concerts.html"><img src="concerts.png" alt="Bouton Concerts" /></a></div>
<div id="media"><a href="media.html"><img src="media.png" alt="Bouton Médias" /></a></div>
<div id="++"><a href="++.html"><img src="++.png" alt="Bouton ++" /></a></div>

</div>

Mais, dans ma pages les images ne se mettent pas à côtés, elles se mettent les unes en dessous des autres...
Pourtant dans mon CSS j´ai bien mis la taille du div #menu, à savoir :

1. menu

{
top: 10%;
width: 760px; height: 80px;
margin-top: 50px;
}

Donc comment je pourrais remedier à ce problème ? Je voudrais qu´elles s´affichent à côtés.

Logique, tu les as mis dans des div.
Donc : soit tu mets autre chose que des div (une liste <li>, <span> ...), soit tu mets un display:inline sur tes div

J´ai dis une connerie pour "une liste <li>"

Heuu..
J´ai esayer ça avec les deux premiers mais ça marche pas

<div display:inline id="news"><a href="accueil.html"><img src="news.png" alt="Bouton News" /></a></div>
<div display:inline id="groupe"><a href="agroupe.html"><img src="groupe.png" alt="Bouton groupe" /></a></div>

J´ai essayer avec les span, ça marche mais du coup le hover ne marche plus...

Dispay:inline est un style css....

AAah d´accord
J´essaie.

Ca marche pas...
Tout ce que ça chance c´est que mes images ne sont plus par dessus tout mais ça fait juste descendre le corps.

J´ai finalement réussi !
Mais deux problèmes s´ajoutent

Donc déjà, mes boutons se mettent côte à côte, mais seulement trois, après ça va à la ligne et là les trois derniers.
Ensuite, il y a un petit trou blanc entre chaque boutons, mais comme il y a des images qui se prolongent dans chacuns des boutons et bien ça fait par exemble un visage coupé en deux, à cause ce ce trou.

Et puis le hover ne marche pas...
Voici mes codes :

XHTML
<div id="menu">
<span id="news"><a href="accueil.html"><img src="news.png" alt="Bouton News" /></a></span>
<span id="groupe"><a href="agroupe.html"><img src="groupe.png" alt="Bouton groupe" /></a></span>
<span id="bio"><a href="bio.html"><img src="bio.png" alt="Bouton Bio" /></a></div>
<div id="disco"><a href="disco.html"><img src="disco.png" alt="Bouton Disco" /></a></span>
<span id="concerts"><a href="concerts.html"><img src="concerts.png" alt="Bouton Concerts" /></a></span>
<span id="media"><a href="media.html"><img src="media.png" alt="Bouton Médias" /></a></span>
<span id="more"><a href="++.html"><img src="++.png" alt="Bouton ++" /></a></span>

</div>

CSS

1. menu

{
top: 10%;
width: 900px; /* Très important : donner une taille au menu */
height: 80px;
margin-top: 50px;
}

img
{
border: 0;
}

1. news

{
width: 139px;
height: 80px;
}

1. news:hover

{
background: url(termine.gif) no-repeat;
}