> Tous les forums > Forum des Webmasters
 Un h1 avec un lien qui me donne de la misère!
Ajouter un message à la discussion
Page : [1] 
Page 1 sur 1
fleuretta
  Posté le 02/04/2009 @ 01:12 
Aller en bas de la page 
Astucienne

Encore moi qui en arrache (a de la difficulté) avec la nouvelle version du site.

J'ai voulu mettre un lien dans un h1

Dans la css c'est ainsi:


.menu_centre{

background-color:#fbfbfb;
border:#ffffff 1px solid;
width:464px;
height:auto;
font-family:Arial, Helvetica, sans-serif;
font-size: 13px;
line-height: 30px;
font-weight:normal;
color:#000000;
text-align:left;

margin-left:auto;
margin-right:auto;
top:-5px;
position:relative;
padding:8px;}



.menu_centre h1 a{

font-family:Arial, Helvetica, sans-serif;
font-size:16px;
font-weight:bold;

color:#db5b06;
height:30px;
text-align:left;
text-indent:20px;
padding-top:20px;
border-bottom:1px solid #db5b06;
width:464px;
text-decoration:none;

}

.menu_centre h1 a: hover{color:#f2be95;
text-decoration:none;}

.menu_centre h1 a: visited{color:#f2be95;
text-decoration:none;}

Dans ma page c'est ainsi:

<div id="coted">
<a name="sucre"></a>
<div class="ombre">
<div class="menu_centre">
<h1><a href="modecuisson.php">Les modes de cuisson</a></h1><br>
<h2>&nbsp;Le sucre</h2>
<img src="../annuaire/image/sucre_gr.jpg" alt="Le sucre" width="80" height="80" align="right" style="flaot:right; margin-top:-50px; margin-right:20px;">
<br><br>
<ul style="width:400px;">
<li><a href="#stade"><u>Stades de cuisson du sucre</u></a></li>
<li><a href="#caramelisation"><u>Caramélisation de différents sucres</u></a></li>
</ul>

<br>
<br><br>
<p style="text-align:left; font-weight:normal; margin-left:10px;"><a href="modecuisson.php"><u>Les modes de cuisson</u></a><br><br></p>

</div></div>

Ce n'est rien de bien sorcier mais pourtant le h1 de ma class menu_centre n'est carrément pas pris en considération si je mets un lien. Sans lien tout fonctionne et s'affiche correctement.

Dans la css j'ai tout enlevé dans le h1 qui était tout seul. Si je mets mon code css dans ce fameux h1 qui est rattaché à tout le site ça marche mais cela défait tous mes autres h1 du site.

Pourquoi le h1 que j'attribue à ma class menu_centre avec un lien ne fonctionne pas?

Merci de m'aider encore une fois

Publicité
Tasgarth
 Posté le 02/04/2009 à 09:22 
Aller en bas de la page Revenir au message précédent Revenir en haut de la page
Astucien

Bonjour,

Et avec un background-color: transparent en plus ?

du genre :

<style type="text/css">
a:link
{color: #...; text-decoration: none; background-color: transparent }
a:visited
{ color: #...; text-decoration: none; background-color: transparent }
a:hover
{ color: #...; text-decoration: none; background-color: transparent }
a:active
{ color: #...; text-decoration: underline; background-color: transparent }

A+

fleuretta
 Posté le 02/04/2009 à 14:26 
Aller en bas de la page Revenir au message précédent Revenir en haut de la page
Astucienne

Tasgarth

J'ai mis un background transparent et cela ne change rien.

Je pensais que c'était le h1 le problème donc j'ai changé le nom de ma class en l'appelant titre.

Aussitôt que je mets un .titre a le problème revient. La css que j'ai mis n'est plus pris en compte et c'est ça qui prend le dessus.

a{text-decoration:none;
color:#b76206;
background-color:transparent;}

a:link {
text-decoration: none;
color:#632301;
background-color:transparent;
}
a:visited {
text-decoration: none;
color:#8a3203;
background-color:tranparent;


}
a:hover {
text-decoration: none;
color:#b05017;
background-color:transparent;

}
a:active {
text-decoration: none;
background-color:transparent;

}

La seule affaire qui est pris en compte est la grosseur du texte que j'ai mis dans ma class.

Quelqu'un aurait une tite solution?

Merci

elle
 Posté le 02/04/2009 à 18:37 
Aller en bas de la page Revenir au message précédent Revenir en haut de la page
  Grande Maîtresse astucienne

Et si tu mets ton menu_centre en id ?

elle
 Posté le 02/04/2009 à 18:40 
Aller en bas de la page Revenir au message précédent Revenir en haut de la page
  Grande Maîtresse astucienne

En passant, pas besoin de saut de ligne entre le h1 et le h2, c'est automatique (balises blocs).

fleuretta
 Posté le 02/04/2009 à 19:11 
Aller en bas de la page Revenir au message précédent Revenir en haut de la page
Astucienne

Elle

Le div ne fonctionne pas. Le saut de ligne était pour faire plus d'espace.

Maintenant je suis sur une solution...

En mettant un float:left la css s'applique. Sauf que j'ai un petit problème sous IE6.

Dû au float left je dois mettre pour IE6 un width plus petit mais la bordure ne fait pas toute la largeur voulue. Si j'agrandis mon width c'est le tableau qui se pousse à gauche.

Ah oui! J'oublais! Le hover ne fonctionne pas ni le visited.


.menu_centre .titre a{
float:left;
font-family:Arial, Helvetica, sans-serif;
font-size:16px;
font-weight:bold;
color:#db5b06;
height:30px;
text-align:left;
text-indent:20px;
padding-top:20px;
border-bottom:1px solid #db5b06;
width:464px;
_width:444px;
text-decoration:none;



}

.menu_centre .titre a: hover{color:#0099FF;
text-decoration:none;}

.menu_centre .titre a: visited{color:#f2be95;
text-decoration:none;}

En tout cas c'est un début de solution.

Merci

elle
 Posté le 02/04/2009 à 19:23 
Aller en bas de la page Revenir au message précédent Revenir en haut de la page
  Grande Maîtresse astucienne

fleuretta a écrit :

Le saut de ligne était pour faire plus d'espace.

Utilise le margin, le padding, le line-height... Ça te permet de mettre l'espace directement dans ton css et d'obtenir un espacement identique peu importe le navigateur.

Page : [1] 
Page 1 sur 1

Vous devez être connecté pour participer à la discussion.
Cliquez ici pour vous identifier.

Vous n'avez pas de compte ? Créez-en un gratuitement !
Recevoir PC Astuces par e-mail


La Lettre quotidienne +226 000 inscrits
Avec l'actu, des logiciels, des applis, des astuces, des bons plans, ...

Les bonnes affaires
Une fois par semaine, un récap des meilleurs offres.

Les fonds d'écran
De jolies photos pour personnaliser votre bureau. Une fois par semaine.

Les nouveaux Bons Plans
Des notifications pour ne pas rater les bons plans publiés sur le site.

Les bons plans du moment PC Astuces

Tous les Bons Plans
99,99 €Souris sans fil Logitech G Pro X Superlight à 99,99 €
Valable jusqu'au 02 Décembre

Amazon fait une promotion sur la souris sans fil Logitech G Pro X Superlight qui passe à 99,99 € au lieu de 120 €. Cette souris pèse moins de 63 grammes et offre un glissement sans la moindre friction. Équipée du capteur optique Hero de 25000 dpi, la souris Pro X Superlight transmet chaque mouvement, et ce, avec une précision et une réactivité optimales, quelle que soit la vitesse.


> Voir l'offre
44,99 €SSD WD Blue SN550 500 Go (NMVe M.2, 2400 Mo/s) à 44,99 €
Valable jusqu'au 02 Décembre

Amazon fait une promotion sur le SSD WD Blue SN550 500 Go (NMVe M.2) qui passe à 44,99 € livré alors qu'on le trouve ailleurs à partir de 70 €. Ce SSD utilise une interface M.2 NVMe PCIe Gen3 x 4 pour une connexion simple et des performances exceptionnelles : jusqu’à 2 400 Mo/s en lecture séquentielle et jusqu’à 1 950 Mo/s en écriture séquentielle. Le SSD est doté de la technologie 3D TLC NAND haute densité offrant une endurance d’écriture durable et assorti d’une garantie de cinq ans. 

Notez que la version 1 To est également en promotion à 69,99 € au lieu de 90 €.


> Voir l'offre
29,99 €Disque dur Western Digital Blue 1 To à 29,99 €
Valable jusqu'au 03 Décembre

Cdiscount fait une promotion sur le disque dur Western Digital Blue 1 To à 29,99 €. Ce disque dur 3.5 pouces SATA III  tourne à 7200 tr/min.


> Voir l'offre

Sujets relatifs
aide creations de boutons qui donne sur un lien video
lien qui fonctionne avec IE7 et pas avec Firefox
images tournantes avec lien
courriel avec lien vers site
Lien cliquable avec bannière flash
probleme d affichage avec un lien a href
pour faire un lien avec un texte?
Rollover sur zone lien avec Dremaweaver
image avec lien ver site
banniere avec lien du site
Plus de sujets relatifs à Un h1 avec un lien qui me donne de la misère!
 > Tous les forums > Forum Forum des Webmasters