infernum Posted June 14, 2006 Share Posted June 14, 2006 salut, comment faire pour mettre un menu sur la gauche de la page afin d'afficher les pages sur la droite du menu comme sur le site de www.wanadoo.fr quelle est la commande ? Link to comment Share on other sites More sharing options...
windu.2b Posted June 14, 2006 Share Posted June 14, 2006 Salut, La technique consiste à créer une div pour ton menu et une div pour ton texte. ensuite tu peux faire un style CSS comme suit pour ton menu: .leftMenu { float: left; width: 20%; } et celui-ci pour ton bloc de texte: .blocText { float: right; width: 80%; } Dit de tête, donc c'est à tester mais ca devrait être bon! Link to comment Share on other sites More sharing options...
Quarky Posted June 14, 2006 Share Posted June 14, 2006 Oui ok windu mais faut penser à rajouter un clerarer après pour se prémunir d'éventuels problèmes ... en gros le clearer ramènes en début de ligne suivante les éléments qui suivent les précédentes div; donc après tes div de menu et contenu, rajoutes : <div class="clearer"> </div> et dans ton css : .clearer { clear : both; } Link to comment Share on other sites More sharing options...
windu.2b Posted June 16, 2006 Share Posted June 16, 2006 Tout à fait Quarky (ca se voit trop qu'on a suivi les mêmes cours ou on arrive encore à le cacher? ) Link to comment Share on other sites More sharing options...
Quarky Posted June 16, 2006 Share Posted June 16, 2006 On va dire qu'on a une méthode de travail qui à quelques points de ressemblance .... Link to comment Share on other sites More sharing options...
windu.2b Posted June 16, 2006 Share Posted June 16, 2006 On va dire qu'on a une méthode de travail qui à quelques points de ressemblance .... Au passage, je me permets de te reprendre sur ton commentaire #3: Tu as oublié un espace insécable entre la balise d'ouverture et la balise de fermeture div! Ce qui donnerait donc: <div class="clearer"> </div> Sans ça, j'ai déjà eu quelques problèmes parfois... Link to comment Share on other sites More sharing options...
Quarky Posted June 16, 2006 Share Posted June 16, 2006 Je l'avais pourtant tappé ! Mais il n'a pas du passer sais pas trop pourquoi ... Link to comment Share on other sites More sharing options...
Cubic-Design Posted June 16, 2006 Share Posted June 16, 2006 Pas obligé de creer une div pour ça. Suffit de placer le clear both dans les propriété css des div concerné par un éventuel décalage (par exemple un footer) Link to comment Share on other sites More sharing options...
Quarky Posted June 17, 2006 Share Posted June 17, 2006 En meme temps moi je trouve que c'est plus clair avec une div pour ca ... Et si tu veux faire des changments dans l'organisation des blocs, alors tu vois le tout très bien dans le squelette html ! Link to comment Share on other sites More sharing options...
Yangzebul Posted June 17, 2006 Share Posted June 17, 2006 Oui, mais ton bloc a pas de vrai valeur sémantique. Dans l'idéal il faut séparer contenu et mise en forme, hors la tu introduit un bloc qui a pour seule finalité la mise en forme. Link to comment Share on other sites More sharing options...
Quarky Posted June 17, 2006 Share Posted June 17, 2006 Exact et voici une solution : (pas eu le temps de tout lire ...) How To Clear Floats Without Structural Markup Link to comment Share on other sites More sharing options...
Yangzebul Posted June 17, 2006 Share Posted June 17, 2006 Très interessant comme lien ! Merci, je vais faire chauffer mon imprimante. Link to comment Share on other sites More sharing options...
Yangzebul Posted June 18, 2006 Share Posted June 18, 2006 Sinon, j'y pense, une autre solution plus simple serait d'utiliser cela: xhtml <hr/> css hr{ clear: both; height: 0; } Sémantiquement c'est parfait, hr (horizontal rule) est prévu pour ça. Edit: mais bon une solution sans balise reste à mes yeux quand même plus élégante. C'est dommage que sur le lien que tu as donné ils soient contraint d'utiliser des hacks pour faire tourner ça partout. Je suis toujours réticent à user de telles solutions: je considère que c'est au navigateur de se corriger, mieux vaut laisser laisser tel quel si ça se dégrade de manière correcte. Link to comment Share on other sites More sharing options...
infernum Posted June 22, 2006 Author Share Posted June 22, 2006 merci à tous pour les infos je ne suis qu'un débutant, vous pourriez me dire comment faire pour que ma feuille de style css soit prise en compte par IE, par FireFox tout s'affiche correctement. perso.orange.fr/jcbtsinfo merci. es ceque je dois ajouter qque chose ? h19 { font-family : nina; font-size : 12pl; font-weight : bold; font-style : oblique; color : #d55454; } a:visited:hover:after { font-family : nina; color : #d55454; content:", déjà visité !"; } Link to comment Share on other sites More sharing options...
Quarky Posted June 23, 2006 Share Posted June 23, 2006 Déjà sémantiquement, c'est pas très correct d'utiliser un h19 alors qu'il n'y a pas de h1, h2, ... h18 auparavant sur ta page ... Pour remplacer ca, tu peux faire : <div id='h19'>TON TEXTE</div> Le nom de l'id peut être changé mais il faudra aussi le changer dans le css. Normalement cela devrait permettre un "stylage" ( ) du texte sous IE. Mais pour ce qui est des pseudo-classes :before et :after, IE ne les prend pas en charge ! dsl ... Link to comment Share on other sites More sharing options...
infernum Posted June 23, 2006 Author Share Posted June 23, 2006 Déjà sémantiquement, c'est pas très correct d'utiliser un h19 alors qu'il n'y a pas de h1, h2, ... h18 auparavant sur ta page ... Pour remplacer ca, tu peux faire : <div id='h19'>TON TEXTE</div> Le nom de l'id peut être changé mais il faudra aussi le changer dans le css. Normalement cela devrait permettre un "stylage" ( ) du texte sous IE. Mais pour ce qui est des pseudo-classes :before et :after, IE ne les prend pas en charge ! dsl ... je viens de faire la modif je n'ai pas touché a la feuille css, j'ai modifié mon fichier html, j'ai mis <div id="h16">B</div><div id="h11">ienvenue </div> voila mon css h11 { font-family : nina; font-size : 13pt; font-weight : bolder; font-style : italic; color : #a2979c; } h16 { font-family : nina; font-size : 15pt; font-weight : bolder; font-style : italic; color : #885e66; } avec div ci dessus fire fox et IE ne les prennent pas en compte même en les renommant en h1 et h2 en gardant les div aucune couleur aucune police est affiché. j'ai essayé en renommant avec h1 et h2 sans les div ca fonctionne sur IE et FF mais ca provoque un retour a la ligne partout comme ca : B ienvenue comment l'éviter ? Link to comment Share on other sites More sharing options...
Quarky Posted June 23, 2006 Share Posted June 23, 2006 En fait tu n'as tout simplement pas compris l'utilisation des balises H1 H2 ... Ce genre de balises est fait pour les titres et introduit un stylage par défaut. Pour un souci de clareté et de respect des normes, il faut impérativement respecter l'ordre des chiffres. C'est-à-dire que le titre principal sera balisé par h1, le sous-titre par h2 ... Mais pour un même texte, on ne peut pas utiliser deux niveaux de balises comme tu le fais ! En gros tu auras : <h1>Titre principal</h1> <h2>Titre de niveau 2</h2> ... Je te conseilles fortement de faire une bonne recherche sur le sujet pour te mettre les idées au clair ! Link to comment Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.