Aller au contenu

Perrine

Membre+
  • Compteur de contenus

    1 409
  • Inscrit(e) le

  • Dernière visite

Tout ce qui a été posté par Perrine

  1. C'est bizarre sous IE héhé Quand on charge la page, le menu s'affiche d'une certaine façon, et dès qu'on passe le curseur dessus, un a:hover doit se déclencher et la mise en forme change quelque peu.
  2. Bonjour @Titag : l'unité est inutile quand tu indiques une valeur à 0. Que ce soit des px, en em ou en %, c'est toujours zéro @bieuzent : C'est bizarre, en fonction du rafraichissement de la page sous IE, les bordures apparaissent en totalité, et des fois, n'apparaissent pas... je ne vois pas trop :/ Pense à passer ta page au validateur. En 1.0 Strict, l'atribut target n'est pas autorisé.
  3. Bonjour Thersite et merci pour le lien, mais comme indiqué, ce forum ne s'occupe que des offres ADSL :/ Non seulement, en bas débit, on surfe lentement mais en plus, maintenant, on est même plus illimité ou alors pour des tarifs exorbitants Vraiment la poisse cette fracture numérique (surtout quand elle nous touche )
  4. Oui, en fait c'est les commentaires qui posaient problème En CSS, les commentaires s'écrivent entre /* et */ et pas // comme en PHP Pour le padding-bottom des paragraphes, oui. Tu le mets dans p si tu veux espacer les paragraphes entre eux. Le line-height sert à espacer le texte au sein du paragraphe
  5. Je comprends pas, ça marchait très bien sur IE, FF, Netscape et Opera hier ... je regarde tout ça
  6. Oui, tu as du changer avant que je réponde. Maintenant, le problème vient du </div> qui apparait juste après l'image. Pourquoi tu fermes le div #page si tôt ? #page englobe toute la page donc il s'ouvre juste après le <body> et se ferme juste après
  7. Oui mais tu ne mets pas ton image dans #page c'est pour ça qu'elle reste en bas de page Il faut que #image soit dans #page. Pour l'instant, en schématisant, ta page est construite comme ça : <body> <div id="page"></div> <img /> </body> et il faudrait <body> <div id="page"> <img /> </div> </body>
  8. J'ai un peu honte mais je n'ai rien fait Je pensais que FT allait nous faire un joli cadeau de Noël en installant l'ADSL dans ma commune ... je me suis fourvoyée Dans moins de 15 jours, je perds le forfait illimité grâce auquel je travaillle tous les jours, ne sachant trop vers quoi me diriger. Si tu es en 56K, il te reste le forfait de Tiscali : -http://register.tiscali.fr/forfaits/signup.php3?ref=193&goto=RTC En Numeris, la facture est un peu plus élevée : -http://register.tiscali.fr/forfaits/signup.php Tiscali demande un engagement sur 12 mois et comme je ne sais pas dans combien de temps l'ADSL arrivera chez nous, je ne peux pas m'engager pour autant de temps. Dernier recours pour l'instant : le forfait illimité jour que j'ai tant décrié dans le post initial :/ Vraiment dommage de laisser pour compte la majorité de la population rurale Mais bon, on a déjà l'air frais et les vaches ! Ceci dit, et j'en resterai là, ma soeur habite Montauban (dans le 82) et après vérification, son quartier n'est pas raccordé à l'ADSL alors qu'elle habite le centre ville et que cette ville ne compte pas moins de 52.000 habitants !
  9. Oui une petite mais c'est ma faute, j'ai du omettre de le dire Quand tu veux positionner un élément en absolute (ici ton image), il faut que le conteneur (donc le div #page) soit lui-même positionné. Dans la feuille de style initiale, je te proposais ceci : #page{ width:750px; background:#FFFFFF url(img/header.jpg) top no-repeat; margin:0 auto; padding-top:160px; position:relative; // <-- je positionne le div } Il suffit donc que tu rajoutes le position:relative pour #page (le conteneur) et #image pourra à son tour se positionner
  10. Dans la page index.htm, il s'affiche mais il ne faut pas que tu le mettes dans #menu. Place le dans #page, en début ou fin de code, comme tu préfères (le mieux étant la fin puisque c'est un + graphique qui n'apporte rien au contenu et donc inutile pour les utilisateurs de navigateurs textuels) En le mettant dans #page, tu peux l'afficher n'importe où dans ce div. Si tu le mets dans #menu, tu pourras le placer que dans ce div or ce n'est pas ce nous cherchons ici. Tu peux le placer après le div #footer (et pas dedans). L'essentiel est que son conteneur soit #page
  11. Hola paquito ! Paquito a des origines espagnoles si je ne m'abuse, non ? Bienvenue sur ce forum et bonne chance pour ton annuaire de forums
  12. Bonjour michael Quelle activité ce matin Je préfère avec l'image qui change sur chaque page. Sans ça, c'est un peu vide je trouve le haut de page. Si tu veux l'intégrer, c'est ce code ci : <img id="image" src="img/accueil.jpg" alt="illustration pour la page d'accueil"/> et dans la feuille de style : #image{ position:absolute; //on sort l'image du flux, c'est à dire qu'elle devient un élément que l'on peut placer où l'on veut top:55px; //l'image est positionnée à 55px du haut de son conteneur, ici le div #page left:360px; // l'image est positionnée à 360px du côté gauche de son conteneur, toujours le div #page } Tu n'as plus qu'à changer le chemin de l'image sur chaque page ensuite Pense à compléter les balises meta keywords et description sur toutes tes pages. Sur depannage.htm, il y a ça à 2 reprises : <p> </p> Est ce que c'est pour faire apparaitre une ligne vide entre le titre et le texte ? Si c'est le cas, tu peux simplement intervenir sur la balise h2 dans la feuille de style : h2{ font-family:Arial, Helvetica, sans-serif; font-size:20px; color:#FF0000; text-align:center; padding:5px 0; } En ajoutant un margin-bottom, tu peux mettre un espace supplémentaire entre le titre h2 et le bloc suivant. En savoir plus sur les boites : Le modèle des boîtes. Il te suffit donc de rajouter la ligne suivante : margin-bottom:15px (par ex) Ah et tant que j'y pense, j'avais fait un test pour espacer les paragraphes (mais uniquement dans le div #gauche), parce que je trouvais que les paragraphes étaient trop collés entre eux : #gauche p{ padding-bottom:15px; } Je pense que tu peux généraliser à tous les paragraphes en mettant ce padding dans le p{ font-family:Verdana, Arial, Helvetica, sans-serif; line-height:1.4; } Bon voilà, en vrac J'espère que la construction de pages en XHTML/CSS t'a plu Perso, je m'amuse toujours autant héhé
  13. Re michael Je viens de voir que tu avais construit ta page depann.htm. Les balises dl, dd et dt que tu utilises ne sont pas appropriées dans ce cas là. Ces balises servent à faire des listes de définition. Or, ici, tu présentes du texte qu'il suffit de mettre dans des balises <p> Tu peux sans problème utiliser le squelette que j'ai construit et remplacer les titres et textes nécessaires, ce sera beaucoup plus propre
  14. En fait, pour faciliter (mais peut-être que ça t'a embrouillé, dsl dans ce cas), je n'ai fait qu'une image unique pour le haut de la page que je mets en fond de la div #page, #page englobant tout le contenu. L'image de fond : J'ai vu que tu avais supprimé ce div (#page), c'est pour ça que ton image a disparu et que le contenu est collé à gauche. Si on décortique le div #page : #page{ width:750px; // largeur de 750 px background:#FFFFFF url(img/header.jpg) top no-repeat; // image ci-dessus mise en fond, collée en haut margin:0 auto; // on centre la page padding-top:160px; // un padding pour que le premier conteneur du div #page (ici le div #menu se situe à 160px de haut position:relative; // on positionne (même si ici ça ne change rien dans sa position) afin de pouvoir positionner en absolute le div #image } Maintenant, j'aurai aussi du expliquer le code suivant : <h1 class="titre">Support informatique / Dépannage, formation, assemblage</h1> h1.titre{ display:none; } Puisque le titre du site est affichée dans une image (celle que tu as remise dans le code HTML), j'ai souhaité tout de même faire apparaitre dans le code une balise h1 mais que je masque grâce au CSS. C'est une manière de titrer un document si la CSS est désactivée. Le div #image est placée à la fin de la page HTML mais tu peux le mettre où tu veux. #image{ width:auto; position:absolute; top:55px; left:360px; } A partir du moment où un bloc conteneur est placé en absolute, il est retiré du flux et se ballade comme un électron libre, qu'on place avec les attributs left et top dans ce cas. --------------- Je ne trouve pas que ce soit beaucoup plus chaud. Le transitional reste assez souple. A vrai dire, et compte tenu des connaissances de michael, je lui conseille d'apprendre directement le XHTML plutot que le HTML D'ailleurs, un lien qui explique les différences entre XHTML et HTML, à lire absolument. Après ça, aucune raison de rester en HTML : Passer du HTML au XHTML
  15. Bon, finalement, je me suis laissée prendre au jeu Déclaration de l'encodage des caractères Cette ligne <META http-equiv="Content-type" ONTENT="text/html;charset=iso-8859-1"> apparait 2 fois dans ton <head>, c'est inutile. Et quand tu déclares le charset (jeu de caractères), autant le faire en début de <head> pour que cela s'applique à tous les métas. Il y a ensuite une foule de balises META, je n'en connais pas la moitié. Les plus importantes sont la balise keywords (mots clés) et description. Bien sûr, la balise title est à bien travailler et je vois que tu l'as déjà changé Utilisation des CSS Quand je te conseillais de passer aux feuilles de style, c'était pour éviter ce genre de chose : Ici, les attributs de mise en forme sont bgcolor (pour déterminer la couleur de fond), background (pour l'image de fond), text pour la couleur du texte et les 3 autres pour les couleurs de liens. Tous ces attributs sont normalement enregistrés dans la feuille de style et n'apparaissent pas dans le document (mais dans ton cas, comme tu utilises du HTML 4.1, c'est possible) Quand on parle de dissocier contenu et mise en forme, c'est que d'un côté, on a le code XHTML avec les balises (hx, p, div, ... ) qui sont le contenu et d'un autre côté, dans la feuille de style, tout ce qui est en rapport avec la mise en forme (couleurs, images de mise en forme, bordures ...) L'enjeu est donc de construire une page épurée, avec le contenu uniquement puis de construire une feuille de style associée pour la mettre en forme. On se suit ? Je ne suis plus très à l'aise pour la mise en forme des pages avec des tableaux donc je te file une page en XHTML, sans tableau et si tu as des questions, je les commenterai au mieux Le nouveau code - Il y a 2 façons de définir des styles. Tu peux soit définir les styles dans la page html, (comme tu le fais en partie avec cette partie de ta page : Soit créer une feuille externe, avec l'extension .css, et l'appeler avec la balise <link> ou @import Je choisis la balise <link> - Avec une largeur de 790px, les utilisateurs qui utilisent une résolution en 800x600 auront une barre de défilement horizontale. Pour éviter cela, il vaut mieux utiliser une largeur de 750px - Je te conseille de supprimer les images du menu. Elles n'apportent pas de "+ graphique" et servent à présenter du texte donc on va utiliser nous aussi du texte dans notre page HTML. On récupère bien entendu les petites puces situées à droite des liens. - La page se décompose maintenant de la façon suivante : Un div #page qui englobe le tout et permet de définir la largeur de ta page Un div #menu pour le menu Un div #gauche et un #droite pour les 2 colonnes Un div #footer Un ultime div #image pour positionner l'image qui change à chaque page. Pour construire tes autres pages, tu as juste à remplacer les textes à priori. S'il y a des cas particuliers, on regardera - J'ai mis à cette adresse la page avec les images qui y sont liées : http://www.toulouse-webmaster.com/mickael/mickael.htm Et voici le code : <body> <div id="page"> <h1 class="titre">Support informatique / Dépannage, formation, assemblage</h1> <div id="menu"> <ul> <li>Retour à l'accueil</li> <li>Dépannage</li> <li>Formation</li> <li>Assemblage</li> <li>Récupération</li> <li>Produits</li> <li>Société</li> </ul> </div> <div id="gauche"> <h1>Aide informatique</h1> <p><span class="Style5">S</span>upport <span class="Style5">Info</span>rmatique est ravi de vous accueillir sur son espace web.</p> <p>Nos techniciens sont à votre service pour répondre à vos questions, vous former, que ce soit pour le support matériel ou logiciel.</p> <p>Les interventions s'effectuent uniquement en agglomération lyonnnaise.</p> <p>Cette société est en cours de création. Vous êtes intéressé par ce projet? Faites le savoir en écrivant à: michaeljack_AT_free.fr ou en répondant à ces quelques questions.</p> <p>Comment nous contacter?</p> <p>Par téléphone: 04 78 LA SOCIETE EST EN COURS DE CREATION</p> <p>Par mail: EN COURS DE CREATION</p> <hr /> </div> <div id="droite"> <h2>Tarifs</h2> <p>Le déplacement d'un technicien est facturé à la prestation. Les prix approximatifs sont indiqués dans chacune des rubriques du site.</p> <h2>Prestations de services</h2> <ul id="presta"> <li>Création, montage et installation d'un ordinateur sur mesure selon vos besoins.</li> <li>Expertise et conseil sur tout achat informatique, ainsi que sur les moyens de protection de votre ordinateur.</li> <li>Installation et configuration du système d'exploitation ( Windows ou Mac OS) ou de logiciels (antivirus, bureautique...).</li> <li>Dépannage et réparation de votre matériel informatique.</li> <li>Récupération de vos données informatiques en cas de problême ou de non fonctionnement de votre ordinateur.</li> <li>Formation sur logiciels courants, achetés ou fournis avec votre ordinateur.</li> <li>Conseil sur les fournisseurs d'accès Internet, ou autres renseignements informatiques.</li> </ul> <hr /> </div> <div id="footer">Une réalisation <a href="http://www.kooliss.net" target="_blank">kooliss.net</a> © 2004</div> </div> </body> *{ margin:0; padding:0; border:0; } body{ background:#FFFFFF; font:Verdana, Arial, Helvetica, sans-serif; font-size:11px; color:#333333; } .Style5 {color: #FF0000; font-weight: bold; } .Style6 {color: #FF0000} .Style12 {font-size: 14px} p{ font-family:Verdana, Arial, Helvetica, sans-serif; line-height:1.4; } #page{ width:750px; background:#FFFFFF url(img/header.jpg) top no-repeat; margin:0 auto; padding-top:160px; } h1{ font-family:Arial, Helvetica, sans-serif; font-size:20px; color:#FF0000; text-align:center; padding:5px 0; } h1.titre{ display:none; } h2{ font-family:Arial, Helvetica, sans-serif; font-size:20px; color:#FF0000; text-align:center; padding:5px 0; } #menu{ width:150px; background:#FFFFFF url(img/menu.jpg) top right no-repeat; padding:0 172px 0 0; text-align:right; } #menu li{ font-family:Arial, Helvetica, sans-serif; font-size:12px; background:#FFFFFF url(img/bouton.jpg) right no-repeat; padding:0 18px 0 0; list-style:none; line-height:1.5; } #gauche{ width:260px; float:left; padding-left:150px; padding-right:20px; padding-bottom:30px; } #gauche p{ padding-bottom:15px; } #droite{ width:260px; float:left; padding:0 10px 30px 20px; } #presta li{ font-family:Verdana, Arial, Helvetica, sans-serif; font-size:11px; background:#FFFFFF url(img/bulle.jpg) top left no-repeat; list-style:none; padding-left:23px; padding-bottom:5px; line-height:1.5; } hr{ color:#999999; } #footer{ font-family:Verdana, Arial, Helvetica, sans-serif; font-size:11px; width:100%; padding-top:20px; clear:both; text-align:center; background:#FFFFFF url(img/copyright.jpg) top no-repeat; } S'il y a des zones d'ombre, hésite pas Essaie de décortiquer le code pour pouvoir construire toutes les autres pages sur ce modèle. A ce niveau, la page est valide XHTML 1.0 Transitional. Pour finir, je ne saurai que trop te conseiller de visiter les sites du Top Sites pour mieux comprendre tout ça
  16. Il faudrait reprendre pas à pas toutes les modifications que tu as effectuées. Si tu n'as modifié que les alts des images, je ne comprends pas d'où vient le décalage et se plonger dans le code comme ça, ça va être chaud Néanmoins, je suis en train de regarder comment optimiser tout ça La question ensuite est de savoir si tu as le temps, et l'envie, de te plonger dans le HTML (et encore mieux le XHTML) et CSS pour voir si tu pourras apporter les améliorations sur toutes les pages. Je regarde ta page index et je te donne les modifications que j'y ferai, ensuite, on verra
  17. Ah oui, pour les messages d'erreur du W3C, il faut que tu complètes ton doctype : Le doctype qu'il vous faut sur le site de pompage.net En l'occurence, le tien serait :
  18. Bonjour michaeljack, Côté référencement, il serait bien de changer le titre des pages "votresite.com" avec un titre contenant tes mots clés Pense à compléter les "alt" de tes images, notamment pour le menu. En plus, ça améliore l'accessibilité de ton site. Pour l'image bleue sous le logo, attention à ne pas confondre les alt et les title. Les alt sont du texte alternatif qui s'affiche si l'image ne s'affiche pas. Donc, il contient en général une phrase descriptive. Le title contient quant à lui du texte qui s'affiche lorsque le curseur survole l'image. Perso, j'essaie d'y mettre un texte plus dynamique : "Visiter tel site par ex". Dans ton cas, puisque l'image n'apporte rien en terme de contenu et est seulement un "plus" graphique, l'idéal serait encore de mettre cette image en fond dans le <td> Les titres, "aide informatique", "dépannage et réparation" (...) en orange devraient plutôt être contenus dans des <h1> par ex. Les dl sont des listes de défintion. Dans tes pages, tu peux soit utiliser des listes (ul pour des listes non numérotées et ol pour les listes numérotées) ou tout simplement des paragraphes <p>. Côté graphisme, je le trouve joli et facile de consultation. Sur cette page : http://michaeljack.free.fr/siteinfo/recup.htm tu as un grand espace entre ton texte et le bas de page, c'est du aux multiple balises vides. Pense à les supprimer si tu n'y ajoutes pas de texte. Pour finir, je ne saurai que trop de conseiller de dissocier contenu et forme grâce aux CSS afin de supprimer complètement les attributs contenus dans les balises et surtout d'alléger le chargement de tes pages
  19. Un MOD pour que l'administrateur lise les MP des membres de son forum ???? C'est pas sérieux tout ça !
  20. Bonjour Cleden Je suis pas sure de ce que je vais dire mais je pense que ça vient des div spacer et leur clear:both que tu as mis après le div #newsd sur l'index et après chaque div présentant les villages. Par défaut un div est un bloc donc chaque élement positionné après le div sera à la ligne suivante, tu n'as donc pas besoin d'un clear:both pour passer à la ligne. Sinon, je ne vois pas pourquoi tu as utilisé le clear:both ici. J'espère que ça pourra t'aider Edit : J'avais pas fait attention que le problème ne survient que dans FF. Sous IE, pas de souci. Essaie aussi de corriger ton code
  21. Effectivement, j'ai maintenant un sujet pour les 10 derniers billets, l'expéditeur est Olivier et dans le panneau d'affichage des messages, je vois le billet. Une petite question : est-il simple de modifier le fil RSS de manière à ne récupérer que le texte et pas le site tout entier ? Est-il possible à ce moment là de proposer 2 fils différents ? Un avec les graphiques et l'autre en texte ?
  22. Pas compris, Dans TB, on ne voit que (no subject) et quand on fait un aperçu du mail, c'est vide (blanc)
  23. Salut Olivier, Juste pour info, les articles s'affichent mal dans TB aussi. On reçoit bien l'article, mais il a comme sujet : (no subject) et le texte ne s'affiche pas. Pour le reste, je ne peux rien dire car je ne connais pas trop la problématique RSS Bonne chance
  24. Et bien ... voilà une affaire promptement menée Bravo et merci pour ces contributions !
  25. Bonjour Cariboo, Merci pour ce complèment d'info et dsl pour la réponse tardive, je voulais faire quelques tests avant de répondre. J'ai donc essayé de mettre de faire ce que tu as dit mais je ne comprends pas comment écrire les lignes dans mes_fonctions.php3. J'ai bien lu cette page : www.spip.net/f_article1825.html mais je ne sais pas quelle variable utiliser pour définir les strong et em. Dans l'article cité, il est donné l'exemple de $debut_intertitre mais comment appeler les variables qui servent au formatage des {} et {{}} ? ---------------------------- Sinon, je me suis replongé dans le fichier ECRIRE/inc.texte.php3 et en fait, il y a 2 modifications à faire : Une première aux alentours des lignes 847 et l'autre à peine plus bas, aux lignes 871 et + Mais cette solution ne me plait guère puisqu'à la prochaine MAJ, je vais devoir remodifier ce fichier. ----------------------------- Et pour finir, utilises-tu le patch de Pierre De Paepe ?
×
×
  • Créer...