|
Pages: 1
|
Membre
|
Bonjour et félicitations à Support du Web.
Cependant j'ai un petit souci concernant la résolution de l'écran, en effet j'utilise une résolution de 1980x1080, et là aucun problème par contre mes lecteurs n'ont pas tous la même résolution, et si l'on passe en 1024x768 le menu déborde du cadre par la droite, je ne vous explique pas le résultat en 800x600, j'utilise le style 19 avec 7 menus horizontaux ! Y a t'il une solution afin de rendre le menu Web2.0 compatible et lisible avec différentes résolution ?
mon site : http;//www.thieb03linux.fr
|
Admin
|
Bonjour,
Aurait-tu une url pour qu'on puisse voir le résultat?
La seule idée qui me vient à l'esprit est de faire deux menus pour prendre moins de place horizontalement.
Cordialement
|
Membre
|
www.thieb03linux.fr
mon site : http;//www.thieb03linux.fr
|
Membre
|
Chouette un autre linuxien ! 
Rien à voir avec la résolution mais le bouton partage a une taille non proportionnelle en largeur/hauteur. Il est pas assez large.
Non, il n'est pas possible de les redimensionner. Par contre tu peux en créer deux l'un sous l'autre.
Attention, les sous-menu de wallpapers-linux passent en dessous de la pub. Tu devrais leur donner un z-index plus grand (CSS).
|
Membre
|
Citation de Spitfire 95 Attention, les sous-menu de wallpapers-linux passent en dessous de la pub. Tu devrais leur donner un z-index plus grand (CSS).
Bien vu linuxien Ubuntoiste, Ubuntu est ma distrib par défaut sur mon netbook, mais sur mon pc de bureau j'utilise Mandriva !
Comme je ne connais pas trop la propriété z-index, d'après toi quelle valeur pourrais-je lui donner afin d'éviter le chevauchement avec la pub, à temps perdu bien entendu, rien ne presse !
mon site : http;//www.thieb03linux.fr
|
Membre
|
z-index est une propriété très chiante à mettre en place et déjà je ne sais pas comment la mettre. 1 ou 2 devrait suffire.
Pourquoi z-index est-elle chiante ? Parce qu'elle nécessite un positionnement particulier. position:absolute ou fixed. Sur du static ou du relative ça ne fonctionne pas.
Je cherche comment te permettre de l'appliquer mais je sais pas si je réussirais et combien de temps il me faudra pour trouver.
En testant en live sur ta page avec l'inspecteur Chrome le menu ne répond plus donc je sais pas si c'est bon; mais il répond en local mais n'ayant plus les images je ne sais pas s'il passe bien au dessus de la pub adsense.
Essaye ça (sur une page de test) :
<div style="color: rgb(255, 204, 102);position:absolute;width:100%;z-index:2;">
<script type="text/javascript" src="http://services.supportduweb.com/menus-horizon/style-19.js?txt=Accueil%2520et%2520news%3Dhttp%253A//www.thieb03linux.fr/%0Aaide%2520et%2520tuto%3Dhttp%253A//www.thieb03linux.fr/aide%252520et%252520tuto%252520thieb%25252003.html%0Ahumour%2520linux%3Dhttp%253A//www.thieb03linux.fr/humour.html%0A--en%2520image%3Dhttp%253A//www.thieb03linux.fr/zenphoto/humour%252520image/%0A--blagues%2520linux%3Dhttp%253A//www.thieb03linux.fr/humoursuite.html%0Avideos%2520linux%3Dhttp%253A//www.thieb03linux.fr/videoslinux.html%0Awallpapers%2520linux%3Dhttp%253A//www.thieb03linux.fr/wallpaperslinux.html%0A--divers%3Dhttp%253A//www.thieb03linux.fr/zenphoto/%252520fonds%252520d%252520ecran%2525201024x768%252520et%2525201280x1024/%0A--1900x1200%3Dhttp%253A//www.thieb03linux.fr/zenphoto/fonds%2525201920x1200/%0A--linux%2520girls%3Dhttp%253A//www.thieb03linux.fr/zenphoto/linux%252520girls/%0A--mandriva%2520girls%3Dhttp%253A//www.thieb03linux.fr/zenphoto/mandriva%252520girls/%0Ad%25E9tente%2520apr%25E8s%2520linux%3Dhttp%253A//www.thieb03linux.fr/detente.html%0Apartenaires%3Dhttp%253A//www.thieb03linux.fr/partenaires.html%0A">
</script></div></div>
(si tu es tout en HTML sans includes PHP, c'est ligne 73)
|
Membre
|
Ok et en tout cas merci, je vais voir ca dès que possible, vive Linux et l'Open source tchao.
mon site : http;//www.thieb03linux.fr
|
Membre
|
Oui vive l'open source !
... Qu'est-ce que je fais sous Netscape 9 moi ? xD
|
Membre
|
ok spitfire le z-index à l'air de fonctionner, il ne me reste plus qu'à régler mon problème de largeur et de position de menu en fonction des tailles d'écran
mon site : http;//www.thieb03linux.fr
|
Membre
|
J'ai une idée :
body {min-width:1120px;}
.c14 {min-width: 750px;}
|
Membre
|
Ok Spitifire95, je n'y arrive pas, je ne suis pas un spécialiste du css, en tout cas merci pour ton aide c'est vraiment sympa, je retournerai su support du web car il y a plein de bonnes choses, mais pour le menu horizontal je vais essayer autre choses, soit comme ybouane le propose créer 2 menus superposés, soit essayer ca : http://www.thieb03linux.fr/indexsauvegarde+test.html
mon site : http;//www.thieb03linux.fr
|
Membre
|
le seul problème c'est que avec cette solution ex
:http://www.thieb03linux.fr/indexsauvegarde+test.html
je ne sais toujours pas comment centrer le menu horizontal arggg!!!
mon site : http;//www.thieb03linux.fr
|
Membre
|
Oulà... ya du travail.
Bon, je vais télécharger tes fichiers et les travailler en local, parce que t'expliquer tout ce qu'il y a à faire serait trop long et complexe, surtout si tu n'es pas à l'aise en CSS (déjà que moi je l'utilise depuis assez longtemps et je prévois déjà que je vais galérer pas mal avec ça... ).
Je ne sais pas combien de temps ça me prendra mais je vais essayer de faire vite.
Cordialement.
|
Membre
|
Essaie ceci :
./thieb 03 mandriva linux_files/stylecsstest.css :
.pd_menu_01 {
border: 1px solid #004080;
padding: 0;
background: #0000a0 url(backgroundxxx.jpg) repeat scroll center;
margin: 0 auto;
color: #ffcc00;
width:1029px;
}
.pd_menu_01 a, .pd_menu_01 a:visited {
font:bold 12px Arial,Helvetica,sans-serif;
color: #ffcc00;
background-color: #0000a0;
text-decoration: none;
}
.pd_menu_01 ul {
margin: 0;
padding: 0;
list-style-type: none;
color: #ffcc00;
}
.pd_menu_01 ul li {
border-left: 1px solid #004080;
border-right: 1px solid #004080;
float: left;
position: relative;
z-index: 1;
color: #ffcc00;
width:145px;
}
.pd_menu_01 ul li a {
padding: 0 10px;
background: #0000a0 url(purecssmenu-com/images/btn411.jpg) repeat scroll 0% 50%;
color: #ffcc00;
display: block;
height: 35px;
line-height: 30px;
text-decoration: none;
}
.pd_menu_01 ul li ul {
border: none;
background: #0000a0 none repeat scroll 0% 50%;
display: none;
color: #ffcc00;
}
.pd_menu_01 ul li:hover a {
background-color: #008000;
text-decoration: none;
color: #ffff00;
}
.pd_menu_01 ul li:hover ul {
display: block;
position: absolute;
z-index: 999;
top: 29px;
margin-top: 1px;
left: 0;
color: #ffcc00;
}
.pd_menu_01 ul li:hover ul li a {
border-left: 1px solid #004080;
border-bottom: 1px solid #004080;
padding: 0 10px;
display: block;
width: 12em;
height: 35px;
line-height: 35px;
margin-left: -1px;
background-color: #0000ff;
color: #ffcc00;
}
.pd_menu_01 ul li:hover ul li a:hover {
background-color: #ca0000;
text-decoration: none;
color: #ffff00;
}
.pd_menu_01 ul li a:hover {
background-color: #008000;
text-decoration: none;
color: #ffff00;
}
.pd_menu_01 ul li a:hover ul {
display: block;
width: 12em;
position: absolute;
z-index: 999;
top: 29px;
left: 0;
}
.pd_menu_01 ul li ul li a:visited {
background-color: #0000ff;
color: #ffffff;
}
.pd_menu_01 ul li a:hover ul li a {
border-left: 1px solid #004080;
border-bottom: 1px solid #004080;
padding: 4px 16px;
display: block;
width: 12em;
height: 1px;
line-height: 1.3em;
background-color: #0000ff;
color: #ffffff;
}
.pd_menu_01 ul li a:hover ul li a:hover {
background-color: #ca0000;
text-decoration: none;
color: #ffff00;
}
Code HTML de la fin du <!DOCTYPE html><meta http-equiv="Content-type" content="text/html;charset=utf-8">
<meta name="description" content="">
<link rel="shortcut icon" href="ico.png"><link rel="alternate" type="application/rss+xml" href="/rss.xml">
<style></style>
<noscript><h1>JavaScript est nécessaire pour afficher ce site.</h1></noscript> jusqu'à la fin du menu :
<div id="header">
<div style="text-align: center;">
<h1 style="color: rgb(255, 204, 0);">
<img style="width: 50px; height: 50px;" alt="" src="./thieb 03 mandriva linux_files/28739-mandriva-logo_371f6a85ae43c220b9b4915e929b4b54.png">
<img style="width: 48px; height: 49px;" alt="" src="./thieb 03 mandriva linux_files/mandriva-tux_normal.gif">
thieb 03 mandriva linux actualité
<img style="width: 48px; height: 49px;" alt="" src="./thieb 03 mandriva linux_files/mandriva-tux_normal.gif">
<img style="width: 50px; height: 50px;" alt="" src="./thieb 03 mandriva linux_files/28739-mandriva-logo_371f6a85ae43c220b9b4915e929b4b54.png">
</h1>
<div class="pd_menu_01">
<ul>
<li><a href="http://www.thieb03linux.fr/">Accueil et News</a></li>
</ul>
<ul>
<li><a href="http://www.thieb03linux.fr/aide%20et%20tuto%20thieb%2003.html">Aide et Tuto</a></li>
</ul>
<ul>
<li>
<a href="http://www.thieb03linux.fr/humour.html">Humour Linux</a>
<ul>
<li><a href="http://www.thieb03linux.fr/zenphoto/humour%20image/">en images</a></li>
<li><a href="http://www.thieb03linux.fr/humoursuite.html">Blagues Linux</a></li>
</ul>
</li>
</ul>
<ul>
<li><a href="http://www.thieb03linux.fr/videoslinux.html">Videos Linux</a></li>
</ul>
<ul>
<li><a href="http://www.thieb03linux.fr/wallpaperslinux.html">Wallpapers Linux</a>
<ul>
<li><a href="http://www.thieb03linux.fr/zenphoto/%20fonds%20d%20ecran%201024x768%20et%201280x1024/">differentes resolutions</a></li>
<li><a href="http://www.thieb03linux.fr/zenphoto/fonds%201920x1200/">1920x1200</a></li>
<li><a href="http://www.thieb03linux.fr/zenphoto/linux%20girls/">Linux girls</a></li>
<li><a href="http://www.thieb03linux.fr/zenphoto/mandriva%20girls/">Mandriva girls</a></li>
</ul>
</li>
</ul>
<ul>
<li><a href="http://www.thieb03linux.fr/detente.html">Detente apres Linux</a></li>
</ul>
<ul>
<li><a href="http://www.thieb03linux.fr/partenaires.html">Partenaires</a></li>
</ul>
</div>
Me manquait des images pour la CSS en local donc je sais pas si ça s'affiche parfaitement.
PS : Essaye de revoir un peu ton code. Tu as des span vide et des trucs inutiles comme ça. Ça alourdi la page et rend la maintenance plus complexe. Enfin ça c'est un défaut quand on utilise Kompozer et les autres programmes comme cela.
Sinon tu as <head> mais pas </head> ni <body>, essaye donc de revoir ça aussi (ou passe au HTML5 pour plus avoir à t'embêter avec ces choses là ^^)
T'as de la chance d'être d'une "secte" voisine de la mienne sinon je t'aurais pas fait tout ça alors que j'étais déjà débordé
|
Membre
|
J'ai toujours pensé que dans la vie on ne pouvait pas totalement faire confiance à sa famille "native", enfin dans sa globalité ! Mais dans la famille Linux qui est faites de partage, on trouve toujours de l'aide, la preuve en est sur le site Support du Web, avec l'aide d'un cousin Linuxien : Spitfire95.
Cousin, merci à toi,.
Il me reste un problème , mais qui s'avère mineur que je dois pouvoir résoudre seul sans abuser de ton temps, la position du menu au dessus du center
Pour l'instant voila ce que ca donne : http://www.thieb03linux.fr/indexsauvegarde+test.html
mon site : http;//www.thieb03linux.fr
|
Membre
|
en cherchant un peu, en bidouillant un peu j'y suis arrivé, merci à Spitfire95, sans toi cousin , je n'y serai pas arrivé, vous pouvez considérer ce post comme résolu.
mon site : http;//www.thieb03linux.fr
|
Membre
|
Le menu pourrait être amélioré. Les images sont pas adaptés à la largeur du menu. Il faudrait revoir ça.
Heureux de ne pas avoir été là pour t'aider, rien de tel que de trouver soi même pour apprendre ^^
Bonne continuation
|
|
Pages: 1
|
