28173 sujets

CSS et mise en forme, CSS3

H1 sous bloc

Salut à tous,

J'ai un petit problème avec le CSS de mon site sur IE.

Le "Annuaire" qui doit normalement passer au-dessus du bloc passe en dessous :

http://img442.imageshack.us/img442/6246/sdzblemau2.png

XHTML :

<div id="menug">
<h1 style="color: #2593b6;">Annuaire</h1>
<ul><li></li></ul>
</div>


CSS :

#menug
{
margin-left: 35px;
width: 135px;
font-size: 13px;
color: black;
border: 1px;
margin-bottom: 15px;
}


#menug ul {
background: #e4e4e4;
padding-left: 15px;
margin-top: -10px;
padding-top: 20px;
padding-bottom: 13px;}
#menug li
{
background: #e4e4e4;

list-style-type: none;
}

#menug h1
{
margin-left: 5px;
font-size: 19px;
font-family: Verdana;


}


Meici d'avance. :wink: Smiley cligne
Bonjour,

Tu as attribué à ta liste une marge supérieure négative, d'où la superposition.

Au passage, deux petites choses:

- à quoi te sert le div #menug ? est-il réellement nécessaire?
- évite de placer tes styles directement dans les balises, externalise-les systématiquement dans ta feuille de style
Benjamin D.C. a écrit :
Bonjour,

Tu as attribué à ta liste une marge supérieure négative, d'où la superposition.

Au passage, deux petites choses:

- à quoi te sert le div #menug ? est-il réellement nécessaire?
- évite de placer tes styles directement dans les balises, externalise-les systématiquement dans ta feuille de style

Salut,

Merci beaucoup pour ta réponse. Smiley cligne

- le div #menug me sert oui, car ensuite j'ai un div #corps qui doit flotter à sa droite.
- pour les styles, en fait c'est que chaque h1 prend une couleur différente et j'ai la flemme de tout placer dans ma feuille CSS Smiley lol

Pour en revenir au problème sinon, j'ai besoin de cette marge négative car c'est pour placer ce h1 à cheval entre le ul et ma page. Y a t-il une autre solution ?

En tout cas, merci beaucoup pour ta réponse. Smiley cligne
Salut,
Ant a écrit :
- pour les styles, en fait c'est que chaque h1 prend une couleur différente et j'ai la flemme de tout placer dans ma feuille CSS Smiley lol
Comment ça, "chaque h1" ? Une page n'a qu'un et un seul h1...

Ant a écrit :
Pour en revenir au problème sinon, j'ai besoin de cette marge négative car c'est pour placer ce h1 à cheval entre le ul et ma page. Y a t-il une autre solution ?

Je n'ai pas compris ce que tu veux faire... Une petite image serait la bienvenue mais a priori tu dois pouvoir faire ce que tu souhaites en jouant sur les marges internes de ul et h Smiley pas1 .
Bonjour,

Asumbaa a écrit :
Salut,
Comment ça, "chaque h1" ? Une page n'a qu'un et un seul h1...


Le mythe du h1-qui-doit-être-unique-parce-que-c'est-plus-mieux-sémantique étant totalement éculé, merci de ne pas le ressortir Smiley cligne
Modifié par Laurent Denis (16 Feb 2007 - 14:30)
Salut,
Asumbaa a écrit :
Comment ça, "chaque h1" ? Une page n'a qu'un et un seul h1...
C'est une pratique très courante, mais rien n'oblige à le faire.

<edit>Grillé</edit>
Modifié par Julien Royer (16 Feb 2007 - 14:31)
Administrateur
Asumbaa a écrit :
Salut,
Comment ça, "chaque h1" ? Une page n'a qu'un et un seul h1...

Hello,

Ah voilà peut-être la personne qui va nous trouver enfin où cette affirmation est donnée officiellement quelque part.
A l'heure actuelle (et au vu des nombreux sujets créés à ce propos), il semble que rien ne soit dit officiellement à ce sujet.

EDIT : double grillade Smiley biggol

RE-EDIT, ouais mais moi j'etaye mes propos :
- Recherche n°1
- Recherche n°1
Modifié par Raphael (16 Feb 2007 - 14:36)
Bonjour,

tu pourrais essayer de mettre ton H1 en absolute avec un z-index supérieur au ul. par contre tu n'auras plus besoins de ta marge négative.
Laurent Denis a écrit :


Le cadavre ne bouge plus, là, je crois


Pas du tout, la bête reprend des forces Smiley lol

Evidemment la bête c'est la théorie du <h1> unique obligatoire et pas du tout Asumbaa Smiley smile
Je vois que j'ai créer un débat sur les h1 Smiley ravi

Effectivement j'ai plusieurs h1 sur ma page pour les titres des mes menus..

Sinon glow j'ai un peu regardé et z-index a l'air de pas marcher sur IE.. Smiley confus

Merci d'avance Smiley cligne
Modifié par Ant (16 Feb 2007 - 16:12)
Ant a écrit :
Je vois que j'ai créer un débat sur les h1


Non, non... Smiley lol

Tu viens de relancer un troll sur <h1> Smiley biggol

mais comme on est vendredÿ alors c'est parfait Smiley cligne

Bienvenue au club Smiley smile
Modifié par Christian Le Bouler (16 Feb 2007 - 16:15)
Christian Le Bouler a écrit :
Bon sinon par rapport à la question initiale,

rajouter :


#menug h1
{
position:relative;
z-index:100;
}

Parfait, ça marche ! Smiley smile Smiley biggrin
Merci beaucoup à tous pour vos réponses précises c'est top. Smiley cligne

Au passage, je peux avoir des précisions sur cette fonction ?
Modifié par Ant (16 Feb 2007 - 16:21)
Smiley biggol
Je dois ressembler à peu près à ça après votre joli tir groupé Smiley eek

Toutes mes excuses, je ne pensais pas réveiller un vieux troll, ayant toujours appris et lu ce que j'ai écrit plus haut (et que je ne répéterai pas, promis Smiley ravi )
Sujet clos
Aller à