28172 sujets

CSS et mise en forme, CSS3

Bonjour à tous,

Je suis actuellement en train de créer un site en HTML5 et CSS3, et je me heurte à un décalage et je ne comprends pas pourquoi :

j'ai créé un menu (en liste), supprimé les puces et pourtant, les <li> se décalent pour laisser la place des puces (même si elles n'apparaissent pas).

Vous pouvez voir le résultat et le code à l'adresse http://synoveo.alwaysdata.net

D'avance merci Smiley smile
a écrit :

<ul id="menu_left">
			<a href="#"><li>Menu 1</li></a>
			<a href="#"><li>Menu 1</li></a>
			<a href="#"><li>Menu 1</li></a>
			<a href="#"><li>Menu 1</li></a>
			<a href="#"><li>Menu 1</li></a>
		</ul>


mettre les li avant les a Smiley cligne
Salut,

Un ul ne peut avoir comme enfant direct exclusivement un li.

Si tu veux élargir la surface cliquable de l'élément tu peux mettre ton lien en display:block;

Ainsi il prendra la largueur de son parent Smiley smile

Pour ton problème un padding: 0 sur ton ul#menu_left conviendrait. Pour éviter ce genre de comportement tu peux utiliser un reset css
Modifié par Gili (23 Feb 2012 - 01:03)
J'ai fait le changement mais le problème est toujours présent.

Autre problème, mon "corps" ne s'adapte pas à la hauteur de "main", pourtant, si je met du contenu (j'ai testé avec des <br/>) directement dans le "corps" il s'allonge correctement.

(Je suis sur ce site depuis 1 semaine à raison d'une vingtaine d'heure par jour et j'ai recommencé entièrement hier parce que rien ne s'affichait comme je le voulais, je commence vraiment à désespérer, je paie une (même 2:p) chope à celui qui résous mes soucis Smiley langue et je l'affiche dans la page de crédits en prime Smiley langue )
Justaman a écrit :
Autre problème, mon "corps" ne s'adapte pas à la hauteur de "main", pourtant, si je met du contenu (j'ai testé avec des <br/>) directement dans le "corps" il s'allonge correctement.


Ça c'est parce que main est en float:right, ça veut dire que tu le sors du flux et que les autres éléments vont se comportés comme si il n'existait pas.

Tu peux remplacer ton float par :
.main {
display:inline-block;
vertical-align: top;
}


Enfin je te conseil vraiment de revoir la structure de ton site, chez moi ça rame abominablement. Tu devrais définir une div d'une certaine taille qui engloberai tout le contenu, car là le scroll horizontal c'est plutôt bof

Ps: la solution que je t'ai donné tantôt fonctionne chez moi pour ta liste.
Le problème du corps est réglé, mille merci Smiley smile

Par contre le problème du menu de gauche est toujours la Smiley decu

Tu as une barre horizontale ? Chez moi (3 écrans différents) il n'y en a pas...
Le contenu est déja dans une div de taille 100em pourtant
Modifié par Justaman (23 Feb 2012 - 02:11)
Les problèmes évoqués ici sont résolus, mais d'autres sont apparus, pour gagner en clarté et aider les futures personnes qui auront le même souci j'ouvrirai un nouveau topic pour ces problèmes, merci Gili.

Pour les curieux, le code étant corrigé, il est visible à l'adresse du premier message Smiley smile

Edit: Je ne vois pas où notifier que le sujet est résolu
Modifié par Justaman (23 Feb 2012 - 06:26)
Justaman a écrit :
Si je fais ca, seuls les liens sont cliquables, je veux que tout le cadre le soit


Oui certes, mais ton code était faux, il faut bien commencer par corriger les erreurs avant de pouvoir avancer non?