ghost
-
Compteur de contenus
392 -
Inscrit(e) le
-
Dernière visite
Tout ce qui a été posté par ghost
-
Bonjour, Ce qui me gêne un peu c'est la notion "variable" de ta largeur. Si c'est variable en fonction de la résolution en css pur cela ne me semble pas possible car on associe sur la même largeur des blocs en fixe et en %. C'est sûrement possible en y intégrant du dynamique (php) qui calculera la position du bloc à centrer. Si c'est variable en fonction de la largeur définie en dynamique du bloc header, là c'est réalisable en css. Si c'est une bannière extensible c'est encore autre chose ... En fait, il faudrait savoir quel est le but de la chose !!! A tout hasard, juste un bout de code si ça peut t'aider ? <style> #header { overflow: hidden; width: 700px; border: 1px solid black; margin: auto; position: relative; } #conteneur{ width: 550px; float: left; overflow: hidden; position: relative; } #bloc4 { background-color: gray; width: 150px; height: 150px; float: right; } #bloc1 { background-color: blue; width: 80px; height: 150px; float: left; } #bloc2 { background-color: black; width: 150px; height: 150px; position: absolute; left: 50%; margin-left: -75px; } #bloc3 { background-color: red; width: 80px; height: 150px; float: right; } </style> </head> <body> <div id="header"> <div id="conteneur"> <div id="bloc1"></div> <div id="bloc3"></div> <div id="bloc2"></div> </div> <div id="bloc4"> </div> </div> </body>
-
Bonjour, Désolé toujours le même problème de ton positionnement en absolu, ton footer se proméne et si tu changes de navigateur ou même de résolution, tout se chevauche et ta mise en page prend l'eau de toutes parts ...
-
Bonjour, Ben tout en étant subjectif, la chose qui m'a fait tilt et c'est un raccourci facile je l'avoue, c'est cette perspective plongeante vers ce ciel en mouvement associée au vert "bloc opératoire" ... Pour un centre de soins, c'est peut être mal choisi... Peut être un laïus ... Sinon +1 pour la taille de la police !
-
Bonjour, Ton code fonctionne sous IE, c'est juste un problème de préload d'image, au lieu de 2 images de fond, tu pourrais en utiliser une composée de l'image 1 + l'image 2 à la suite et de la positionner avec background:url("fond.jpg"); background-position:0px 0px; pour le fond1 et background:url("fond.jpg");background-position:0px -769px; pour le hover. Cela devrait, je pense régler ton problème. Bon courage Ps tu peux utliser un gif transparent comme zone réactive
-
Bonjour, Et rien qu'en css non? <!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>Test</title> <style type="text/css"> html, body { margin: 0; padding: 0; height: 100%; min-height: 100%; color: white; background-color: black; } .page { width: 400px; height: 250px; background: url(image1.jpg); position: relative; margin: auto; top: 150px; } .page a{ display: block; position: absolute; width: 87px; /* a définir*/ height: 71px; /* a définir*/ background: url(reactive.jpg); top: 45px; /* a définir*/ left: 270px; /* a définir*/ } .page a:hover{ top:0; left:0; width: 400px; height: 250px; background: url(image2.jpg); } </style> </head> <body> <div class="page"> <a href="#" ></a> </div> </body> </html>
-
Bonjour, Le JS n'est pas ma tasse de thé mais les boutons sont codés par numérotation de tes liens sur ta page soit : document.links[1].onmouseover = function() {scrollTop(true);}; document.links[1].onmouseout = function() {scrollTop(false);clearTimeout(timeout);}; document.links[2].onmouseover = function() {scrollBottom(true);}; document.links[2].onmouseout = function() {scrollBottom(false); clearTimeout(timeout);}; document.links[1] = lien n°2 de ta page (0 étant le premier) document.links[2] = lien n°3 de ta page Si tu ne mets aucun lien avant ton div scrollable : document.links[0].onmouseover = function() {scrollTop(true);}; document.links[0].onmouseout = function() {scrollTop(false);clearTimeout(timeout);}; document.links[1].onmouseover = function() {scrollBottom(true);}; document.links[1].onmouseout = function() {scrollBottom(false); clearTimeout(timeout);}; Et ça marche
-
Bonjour, Ben ... On reconnait bien la prose de Frontpage, je ne sais comment le dire mais il vaudrait mieux reprendre les choses à 0 et consulter des tutoriels pour coder avec des bases saines ... Essayes ce site www.siteduzero.com/tuto-3-6-0-apprenez-a-creer-votre-site-web.html . Ca va te paraitre un peu long et fastidieux mais tu y retrouveras ton compte très rapidement. Bon courage
-
Bonjour, Inclus toute ta page dans un conteneur en position relative et ton logo en absolute soit : #conteneur { position: relative; } #logo { position: absolute; bottom: 0; left: 0; }
-
Re <div id="menu_gauche"> <h1>Liens</h1> <ul> <li><a href="">Menu 1</a></li> <li><a href="">Menu 2</a></li> <li><a href="">Menu 3</a></li> <li><a href="">Menu 4</a></li> </ul> </div> Faudra revoir un peu ton css aussi #menu_gauche li{...} etc
-
Bonjour, J'aime aussi ... ça change des ces sacro-saint bibles de designer enfin quelque chose de perso ouf!! Juste un truc bête, un petit renvoi au "top" en fin de page et quelques retouches sur les photos ... (la date ...) Bonne continuation
-
Bonjour, <h1>Liens</h1> <ul class="menugauche"> <li><a href="">Menu 1</a></li> <li><a href="">Menu 2</a></li> <li><a href="">Menu 3</a></li> <li><a href="">Menu 4</a></li> </ul> C'est pas bon autre chose qu'un li dans un ul...
-
Bonjour, A part faire tout bien propre pour que ça fonctionne au maximum des possibilités de chaque navigateur ... Car tu n'as pas que ce problème ... Si je peux te conseiller d'aller faire un tour du côté http(:)//forum.alsacreations.com/forum.php pour voir les tutoriels de gabarits de mise en page et de repotasser la chose ... Tu peux aussi t'inspirer de mon bout de code mais c'est une solution et pas la solution ! Chacun doit trouver la sienne ce qui fait la joie du css ... On peut aussi coller un "emplâtre sur une jambe de bois" mais bon... Bon courage
-
Bonjour, Sauf boulette de ma part c'est realpath('ton_fichier.php') qui te renvoie le chemin absolu ?
-
Bonjour, Tu as une mise en page reposant sur des positions absolute et relative ce qui induit ce genre de problèmes, je ne te parle même pas si tu changes de résolution... Une des solutions consiste à revoir ton code en t'inspirant de : <!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>test</title> <style> #conteneur{ width: 100%; background: #e4e6e9; } #header{ background: #ababab; height: 80px; } #droite{ float: right; width: 200px; height: 500px; } #gauche{ float: left; width: 200px; height: 500px; } #centre{ margin-left: 200px; margin-right: 200px; background: #fff; height: 500px; } #footer{ border: 1px solid #000; background: #fff; height: 30px; margin-top: 50px; margin-bottom: 10px; } </style> </head> <body> <div id="conteneur"> <div id="header"><p> header</p> </div> <div id="gauche"> fond gauche </div> <div id="droite"> fond droit </div> <div id="centre"> centre </div> </div> <div id="footer"> footer </div> </div> </body> </html> Bon courage
-
Bonjour, J'ai eu une fois le même problème mais sur un compaq et comme tout bon dépanneur une fois excédé je lui ai mi une "giflette"... Pas orthodoxe mais depuis ça va mieux ... A consommer avec modération !! Ca arrive parfois que se soit un problème de cable nappe à la charniere aussi <edit> Si c'était la carte graphique tu n'aurais également rien sur un autre écran
-
Bonjour, Concernant les pub et divers effets sonores etc... Ben oui, je fais partie de ceux qui fuient dès que l'on agresse mon (cyber) espace vital donc j'ai tendance à rapidement m'échapper en cas de présence de pub trop envahissante, de flash à charger, de méchante musique (ou pire pub sonore) et je passe encore sur le redimensionnement de mon navigateur !! Je pense ne pas être le seul !! Bon pour quand même être un peu moins virulent et plus constructif: Tu devrais éliminer ton entête sur l'optimisation sous FF car déjà tu te prives ainsi de 65 à 70% des visiteurs qui (les pauvres d'accord !) utilisent IE et surtout car ton site est optimisé IE !! En effet le javascript que tu utilises à son comportement "normal" sous IE !! et FF le débogue à sa façon pour pouvoir l'afficher. Ensuite concernant les erreurs à la validation, un tuyau : les balises du style : <body topmargin="1" bottommargin="1" rightmargin="1" leftmargin="1" background="../images/back.jpg" n'existent pas et sont à remplacer au pire par : <body style="margin-top:1px; margin-right: 1px; margin-left: 1px background: url(../images/back.jpg)"> Pour ton menu et pour que ton site soit compatible, tu peux faire beaucoup plus simple (voir http://css.alsacreations.com/Galeries-de-menus-en-CSS) et pour la syntaxe xhtml et css voir les tutos sur ce forum, celui d'alsacreation ou du site du zero. Dommage aussi la mise en page en tableau mais il ne faut pas trop en demander à un template. Bon courage
-
Liens vers feuille de style css si plusieurs dossiers
ghost a répondu à fgaascht - Forum : (X)HTML et CSS
Bonjour, essaye ça <link href="../style.css" rel="stylesheet" type="text/css"/> Il faut remonter ton répertoire depuis tes dossiers langue pour trouver ton css. -
Bonjour, Excuse moi ! Mais c'est une horreur, une pub au cm², une pub sonore des, textes défilants de tous les côtés ... On dirait une guirlande de Noël tu sais celle qui ne veut plus s'arreter de clignoter et d'hurler "ring a bell" et que tu finis par jeter par la fenêtre ... Ma parole j'y retourne plus Excuse moi encore ! <edit> j'y suis retourné : W3C html Result: Failed validation, 113 errors régle ces problèmes en first </edit>
-
Bonjour, Dans le même style, testé IE et FF <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <head> <title>Test</title> <style type="text/css"> a.bulle { text-decoration: none; color: red; position: relative; } a.bulle span { display: none; } a.bulle:hover { background: none; /* correction d'un bug IE */ z-index: 500; } a.bulle:hover span { color: green; position: absolute; left: 10px; top: 20px; background: yellow; width: 300px; display:inline; } </style> </head> <body> <p > <a class="bulle" href="#"> <span> je suis la définition du mot ...Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Morbi egestas pede ac quam. Etiam lectus elit, vehicula et, ornare in, gravida a, urna. Donec vel ipsum in pede adipiscing scelerisque. Mauris nunc magna, iaculis non, mattis in, commodo at, nibh. Duis ultricies aliquam urna. Duis luctus lorem id est.</span> mot</a> </p> </body> </html> Si ça peut t'aider.
-
Re, Sur le pourquoi de la chose et pour plus d'info : http://openweb.eu.org/articles/cascade_css/ (Merci Mr Laurent Denis)
-
Bonjour, Pas sûr d'avoir tout compris mais pourquoi pas a sup {....} pour ta 2ém balise?
-
Bonjour, Oui effectivement ça marche pas, ok mais quel est le résultat que tu veux obtenir ?
-
Bonjour, C'est interessant, j'ai un projet qui doit sortir (Pas trop vite j'espère!!) avant la fin de l'année sur des produits équivalents. Pour info, on se base sur osCommerce mais (en insistant) sur la version full CSS. Pour plus de renseignements sur le produit : http://www.oscss.org/ Bon courage
-
Bonjour, Pas de problème particulier FF 1.506 Wind XP pro SP2
-
Bonjour, Effectivement autant pour moi ce hack n'est pas nécéssaire dans ce cas !! et seulement utile si with n'est pas employé. Je suis allé plus vite que la musique ...