satchie http://satchie.free.fr | EDIT DU 18 OCTOBRE
Adresse du site: http://satchie7.free.fr/index.html
Je refais mon site qui est terminé à 90%. J'ai un petit prb:
Comment puis-je faire pour que sous IE et Mozilla "Menu" et " A propos" soient alignés?
Pour voir le site en question http://satchie.free.fr/test/index.html
Merci d'avance.
css
Code :
- body {
- font-family: "Trebuchet MS", serif;
- font-size: 12px;
- margin: 0;
- padding: 0;
- background : #ffffff url("design/fond.png" ) repeat-x 0% 0%;
- }
- #header {
- height: 170px;
- background-color: #ffffff;
- background-image:url("design/header3.png" );
- }
- #conteneur {
- position: absolute;
- width: 750px;
- left: 50%;
- margin-left: -375px;
- background-image:url("design/teneur.png" );
- background-repeat: repeat-y;
- background-color:#ffffff;
- }
- #centre {
- background-color:#ffffff;
- margin-left: 150px;
- padding-left: 10px;
- padding-right: 20px;
- background-image:url("design/contenu.png" );
- background-repeat: repeat-y;
- }
- #gauche {
- padding-left:10px;
- position: absolute;
- left:0;
- width: 150px;
- background-image:url("design/menu.png" );
- background-repeat: repeat-y;
- }
- #pied {
- height: 30px;
- background-color: #ffffff;
- background-image:url("design/pied.png" );
- background-repeat: repeat-y;
- text-align:center;
- margin-top: 50px;
- }
- /* titre */
- h1 {
- font-size: 13px;
- font-family: "Lucida Grande", Verdana, Helvetica, Sans-serif;
- color:#c09e64;
- text-align: left;
- }
- /* titre des dates des news*/
- h2 {
- font-size : 13px;
- font-family: "Trebuchet MS", serif;
- color:#425f6a;
- text-align: left;
- }
- /* titre des news*/
- h3 {
- font-size : 13px;
- font-family: "Trebuchet MS", serif;
- color:#3a7100;
- text-align: left;
- }
- /*le menu de navigation */
- h4 {
- font-size : 9px;
- font-family: "Trebuchet MS", serif;
- color : #ffffff;
- text-align: center;
- word-spacing: 10px;
- }
- /*les paragraphes*/
- p {
- color: #3c3c3c;
- font-size : 12px;
- margin: 0px 0px 0px 0px;}
- /*le menu à gauche*/
- .menugauche {
- list-style-image:url("design/puce.gif" );
- margin: 0;
- padding-left:30px;
- }
- p.custo {
- color: #414d61;
- font-size : 10px;
- margin: 0px 0px 0px 0px;}
- p.pied{
- color: #cacaca;
- font-size : 10px;
- margin: 0px 0px 0px 0px;}
- /*les liens*/
- a:link {color: #056f8d; text-decoration:none; font-size : 12px; font-family: "Trebuchet MS", serif;}
- a:visited {color: #056f8d; text-decoration:none; font-size : 12px; font-family: "Trebuchet MS", serif;}
- a:hover {color: #91becb; text-decoration:underline; font-size : 12px; font-family: "Trebuchet MS", serif;}
- /*a.lien2:link {
- font-family: "Trebuchet MS", serif;
- font-size : 12px;
- color: #b6cad2;
- text-decoration: none;
- }
- a.lien2:visited {
- font-family: " "Trebuchet MS", serif;
- font-size : 12px;
- color: #b6cad2;
- text-decoration: none;
- }
- a.lien2:hover {
- font-family: "Trebuchet MS", serif;
- font-size : 12px;
- color: #b6cad2;
- text-decoration: underline;
- }
- a.lien2:active {
- font-family: "Trebuchet MS", serif;
- font-size : 12px;
- color: #b6cad2;
- text-decoration: none;
- }*/
|
le html
Code :
- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
- <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
- <head>
- <title> Satchie :: Accueil </title>
- <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
- <link href="style.css" rel="stylesheet" type="text/css" />
- </head>
- <body>
- <div id="conteneur">
- <div id="header">
- </div>
- <div id="gauche">
- <h2>M e n u </h2>
- <p ><a href="index.html"> News </a>
- <p ><a href="articles.html"> Articles </a>
- <p ><a href="creation.html" > Créations</a>
- <p ><a href="desktops.html"> Desktops </a>
- <p ><a href="archives.html"> Archives </a>
- <img src="design/sepamenu.gif">
- <br>
- <h2>A f f i l i a t i o n</h2>
- <a href="http://perso.wanadoo.fr/planetcyber/lafrenchtouch/" target="_blank"><img src="design/ft.png" border="0" /></a>
- <img src="design/sepamenu.gif">
- <br>
- <h2>I n f o s</h2>
- <p >Pseudo: Satchie
- <p >Nationalité: Française
- <p >Ville: Lyon
- <p >Age: 26</p>
- <p >Mail: <a href="mailto:satchie@free.fr">Satchie@free.fr </a></p>
- <img src="design/sepamenu.gif">
- <br>
- <h2>L i e n s</h2>
- <p class="custo"><a href="http://customxp.net/"target="blank">CustomXP</a><br>
- <p class="custo"><a href="http://www.deviantart.com/"target="blank">Deviantart.com</a><br>
- <p class="custo"><a href="http://www.foood.net/"target="blank">FoodIcons</a><br>
- <p class="custo"><a href="http://www.gfxoasis.com/" target="blank">GfxOasis</a><br>
- <p class="custo"><a href="http://www.rad-e8.com/"target="blank">RadE8</a><br>
- <p class="custo"><a href="http://www.studiotwentyeight.net/"target="blank">Studio28</a><br>
- <p class="custo"><a href="http://www.iconfactory.com/"target="blank">The Icon Factory</a><br>
- <p class="custo"><a href="http://forum.clubic.com/forum2.php3?config=&post=28145&cat=19&cache=cache&sondage=&owntopic=0&p=2&trash=&subcat="target="blank">Topic Clubic.com</a><br>
- <p class="custo"><a href="http://forum.hardware.fr/hardwarefr/Discussions/sujet-10270-1.htm" target="blank">Topic Hardware.fr</a>
- <p class="custo"><a href="http://www.trucsenvrac.com/"target="blank">Trucsenvrac</a>
- <img src="design/sepamenu.gif">
- <br>
- <br>
- <p class="custo">Visites: <img src="http://perso0.free.fr/cgi-bin/wwwcount.cgi?df=satchie.dat&dd=microsc&ft=0" align="middle"></p>
- </div>
-
- <div id="centre">
- <h2>A p r o p o s </h2>
- <p> Bienvenue sur mon site dédié à la personnalisation des interfaces graphiques. Pour un meilleur rendu, je conseille de visiter ce site avec <a href="http://mozilla-europe.org/fr/products/firefox/" target="_blank">Mozilla Firefox</a>: un navigateur sûr, rapide et moderne.
- <img src="design/sepa.gif">
- <p> </p>
- <h2>1 8 o c t o b r e 2 0 0 4 </h2>
- <p>Voici la cinquième version de mon site. Quelques nouveautés à savoir :
- <ul class="menugauche">
- <li> Une refonte complète du site en utilisant les Css. </li>
- <li> Une nouvelle rubrique intitulée "<a href="articles.html" target="_parent">Articles</a>" avec un petit tutorial pour débuter la customisation.</li>
- <li> Un nouveau desk basé sur le style BeOS. <br>
- <a href="Desktop/Grand/beos.png" target="_blank"><img src="Desktop/Petit/beos.png" width="185" height="139" border="0" /></a>
- Plus d'informations dans la rubrique "<a href="desktops.html" target="_top">Desktops</a>"</li></ul>
- <img src="design/sepa.gif">
- <p> </p>
- <h2>1 2 s e p t e m b r e 2 0 0 4</h2>
- <p> <a href="http://nico.aerial-music.com/perso/index.html" target="_blank">Fletchernic</a> et <a href="http://www.ultradesks.fr.fm/" target="_blank">Ultraman</a> deux membres de la Frenchtouch ont récemment refais leur site, à voir absolument.
- <img src="design/sepa.gif">
- <p> </p>
- <h2>31 a o û t 2 0 0 4</h2>
- <p>Le forum <a href="http://www.trucsenvrac.com/" target="_blank">TrucsenVrac</a> organise sur une idée de <a href="http://www.bioscoop.fr.st/" target="_blank">BioScoop</a> un concours de desks sur le thème suivant: autour du monde en 30 jours: évasion dans les pays lointains... <a href="http://www.trucsenvrac.com/forum/viewthread.php?tid=4133" target="_blank">Accès direct au topic</a>. Le concours se termine le 24 septembre.</BLOCKQUOTE>
- <img src="design/sepa.gif">
- <p> </p>
- <h2>30 a o û t 2 0 0 4</h2>
- <p>J'ai testé un logiciel porté de linux sous windows qui offre une expérience originale de customisation, à savoir <a href="http://bb4win.sourceforge.net/bblean/" target="_blank">BbLean</a> qui est une variante du logiciel <a href="http://www.bb4win.org/news.php" target="_blank">Bb4Win</a> qui lui même est un portage de BBox sous linux. En quelques mots l'installation est aisée, la configuration du programme est facile mais il faut souvent passer par l'édition de fichiers *ini (en fait *.rc). Pour le reste il est facilement customisable, de nombreux plug in sont disponibles et une communauté conséquente (voir le forum <a href="http://forums.loose-screws.com/index.php?sid=c2b492afed8cbadcef80b8b2547b86d0" target="_blank">loose-screws.com</a> ) permet d'avoir pas mal d'activité autour de ce logiciel. <br>
- Pour information, la customisation des différents programmes à savoir bsplayer et winamp sur mes deux derniers screenshots n'est pas encore terminée.
- Maintenant, il reste à savoir si BbLean représente une alternative viable à long terme de l'explorer. Suivant mes disponibilités je ferai peut être un petit article sur ce logiciel.
- <img src="design/sepa.gif">
- <p> </p>
- <h2>19 a o û t 2 0 0 4</h2>
- <p>Une petite news pour vous informer que deux membres de la Frenchtouch à savoir <a href="http://perso.wanadoo.fr/ultr4man/" target="_blank">Ultraman</a> et <a href="http://www.bioscoop.fr.st/" target="_blank">Bioscoop</a> ont refait leur site.
- Le même Ultraman a créé son <a href="http://www.ultrablog.fr.st/" target="_blank">blog</a>, alors si vous voulez tout savoir sur la vie trépidente d'un membre de la Frenchtouch, vous savez où aller!
- <img src="design/sepa.gif">
- <p> </p>
- <h2>19 j u i l l e t 2 0 0 4</h2>
- <p>Un nouveau desk basé sur la suite <a href="http://whistl3r.deviantart.com/" target="_blank">Nano</a> par les membres du groupe <a href="http://www.4imp.de/" target="_blank">FOURIMPRESSION</a>. La suite est complète, elle comprend le thème et un shell, une suite d'icones avec des modèles pour en créer d'autres, un skin winamp, des curseurs... C'est une suite que j'apprécie particulièrement car originale et minimaliste.
- <p> </p>
- <h2>1 4 j u i l l e t 2 0 0 4</h2>
- <p>Ce site a été référencé par <a href="http://www.gfxoasis.com/" target="_blank">GfxOasis</a> (ex: design Technika /DT2) comme le site de la semaine.</h3>
- <br>
- <a href="design/gfxoasis.png" target="_blank"><img src="design/gfxoasisp.png" width="202" height="152" border="0" /></a> <img src="design/sepa.gif">
- <p> </p>
- <h2>1 8 j u i n 2 0 0 4</h2>
- <p>Spéciale dédicace à DocVespine! J'ai corrigé la faute :o <br>
- Ajout d'un nouveau desk et de deux walls.</h3>
- <img src="design/sepa.gif">
- <p> </p>
- <h2>1 7 j u i n 2 0 0 4</h2>
- <p>Ajout d'un nouveau desk pour la réouverture, vous remarquerez que j'utilise un nouveau skin pour winamp 5, <a href="http://www.customize.org/details/33750" target="_blank">Hal's Eye</a> que je vous recommande chaudement d'essayer.
- <img src="design/sepa.gif">
- <p> </p>
- <h2>1 6 j u i n 2 0 0 4</h2>
- <p>Nouvelle version du site, c'est la troisième ;-) dans un style plus reposant.
- <img src="design/sepa.gif">
- <p> </p>
- <h2> 1 5 j u i n 2 0 0 4</h2>
- <p>Ajout du lien vers le ring de laFrenchTouch, ring qui rassemble les sites de custo française, bonjour à toute la team!
- Vous avez pu remarquer que le site n'est pas souvent mise à jour, ceci par manque de temps, j'en suis désolé. <br>
- Je tiens aussi à remercier ceux qui m'envoient des mails pour le site, comme toujours n'hésitez pas à me contacter si vous chercher des walls, des icones... je met juste un peu de temps pour répondre ;-) .
- <img src="design/sepa.gif">
- <p> </p>
- <h2> 1 7 a v r i l 2 0 0 4</h2>
- <p>2 nouveaux desktops et 5 archives. Ajout des sites de Fletchernic et Alxboss à l'initiative de Ultraman pour créer un ring sur la custo.
- <img src="design/sepa.gif">
- <p> </p>
- <h2> 1er m a r s 2 0 0 4</h2>
- <p>Quelques petites modifications sur le site (rubrique liens) et un nouveau desk.
- <img src="design/sepa.gif">
- <p> </p>
- <h2> 2 5 f é v r i e r 2 0 0 4</h2>
- <p>Salut à toutes et à tous, ouverture du site.
- <p> </p>
-
- </div>
- <div id="pied">
- <p class="pied">tous droits réservés / satchie 2004 / valide <a href="http://jigsaw.w3.org/css-validator/validator?uri=http://satchie7.free.fr/style.css" target="_blank">css</a></p>
- </div>
- </div>
-
- </body>
- </html>
|
Message édité par satchie le 19-10-2004 à 14:03:39
|