> 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
163,37 €Imprimante 3D Creality Ender 3 v2 à 163,37 € (stock Europe) avec le code TPCROS
Valable jusqu'au 27 Octobre

TomTop fait une belle promotion sur la toute dernière imprimante 3D Creality Ender 3 v2 à 163,37 € avec le code TPCROS On la trouve ailleurs autour de 180 €. L'imprimante est expédiée depuis un stock Europe (en Allemagne). Elle sera donc rapide et vous êtes sûr de ne pas avoir de douane. 

La Creality Ender 3 v2 est l'une des machines les plus populaires actuellement sur le marché. Et pour cause. Elle dispose d'un volume d’impression de 220 x 220 x 250 mm, est équipée d'un plateau chauffant inspiré du BuildTak, d'un nouvel écran LCD 4.3 pouces et offre des fonctionnalités pratiques comme la reprise de l'impression après une coupure de courant ou le conduit pour le filament étroit. L'imprimante 3D est facile à assembler et le calibrage est aisé grâce aux gros boutons. 


> Voir l'offre
292,25 €Ecran PC 34 pouces Samsung LS34J550 ultralarge (WQHD, 4 ms, 75Hz) à 292,25 € livré
Valable jusqu'au 27 Octobre

Amazon Espagne fait une promotion sur l'écran PC 34 pouces Samsung LS34J552WQRXEN ultralarge qui passe à 276,70 € (avec la TVA ajustée). Comptez 15,55 € pour la livraison en France soit un total de 292,25 € livré au lieu de 379 €. Cet écran possède une dalle VA de résolution 3440x1440 à 75 Hz (compatible FreeSync). La fonction Picture-by-Picture intégrée (PBP) permet l'affichage de deux sources différentes côte à côté à leur résolution native. Entrées HDMI et DP.

Vous pouvez utiliser votre compte Amazon France sur Amazon Espagne. Il n'y a pas de douane.


> Voir l'offre
24,95 €Baladeur encodeur K7 USB Tape2PC Blue Edition à 24,95 €
Valable jusqu'au 27 Octobre

Le vendeur Pearl fait une promotion chez Amazon sur le baladeur K7 USB Tape2PC Blue Edition qui passe à 24,95 € au lieu de 40 € habituellement. Ce baladeur vous permettra d'écouter vos anciennes K7 audio, mais aussi surtout de les numériser au format MP3 sur votre PC. Les logiciels fournis permettent de transférer et d’éditer le signal audio.


> 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