problème avec mon site

zib · Message par **zib** » 06 oct. 2006, 15:36

bonjour, je sais, le titre est vague mais j'ai tellemtn de questions que je préfère ouvrir un seul sujet pour toute.
addresse du site : http://perso.orange.fr/zib.c/

alors ce site est fait avec 3 logiciels : Kompozer pour la partie simple, Thingamablog pour la partie "mes construction" et jalbum pour la partie "mes photos/videos"
et il ya une seule feuille de style pour l'ensemble blog/kompozer, les galeries étant dans un style totaement différent!

alors, j'ai quelques problème, surtout pour mon titre, sous IE, maintenant, ça apparait bien mais sous FF c'est vraiment gros!que faire pour résoudre le problème?

dans le menu, je voudrait faire un sous menu dans mes photos video pour mettre le liens vers mes galeries mais je n'y arrive pas avec la méthode proposée par alasacreation, là j'ai besoins d'aide!

la dernière question que je pose c'est est-ce que IE et FF gère pareil les taille police,(a priori non!)

merci d 'avance, zib
ps : d'autre questions viendrons

Message envoyé avec : Mozilla/4.0 (compatible; MSIE 6.0; Windows NT 5.1; SV1; Orange 7.4 ; NaviWoo1.1; .NET CLR 1.1.4322)

zib · Message par **zib** » 06 oct. 2006, 21:02

le problème de la taille des polices semble réglé,

mais le prob du menu reste d'actu,
et j'ai une autre question, lorsque je passe des page sous kompozer aux pages générées par thingamablog, il y a un léer décalacge vertical qui se produit.d'ou ça vient sachant que la feuille se style est la même pour pour tout les pages du site (sf celle de la galerie)?

merci d'avance, zib

Message envoyé avec : Mozilla/4.0 (compatible; MSIE 6.0; Windows NT 5.1; SV1; Orange 7.4 ; NaviWoo1.1; .NET CLR 1.1.4322)

Asumbaa · Message par **Asumbaa** » 08 oct. 2006, 15:25

Salut,

Je ne vois pas le décalage dont tu parles

Pour les polices : dans chaque navigateur, tu indiques une taille "par défaut" qui sera la taille normale du texte si aucune taille spécifique n'est précisée. Toi dans ta feuille de style tu as indiqué que tu voulais 60px pour les éléments de ta "banner", donc ça devrait s'afficher de la même taille sur tous les navigateurs.

Pour le menu : où bloques-tu sur le modèle Alsacreations ? Lequel, d'ailleurs ?

Sinon, quelques remarques, mais si tu n'écris pas le code toi-même ce sera peut-être un peu du Chinois :

- Le HTML est un langage sémantique. Pour écrire un titre, il y a des balises spécifiques (h1, h2... h6) ; un menu c'est simplement une liste ; et les tables sont là pour présenter des données. Si tu peux essaye de respecter cela au maximum, c'est important notamment pour ceux qui viennent sur ton site avec autre chose qu'un navigateur graphique (plage braille, navigateur texte...) Par exemple ton titre sera simplement :

Code : Tout sélectionner

<h1><a href="" title="Retour à l'accueil">Le site perso de Zib</a></h1>
<h2>le modélisme naval radiocommandé</h2>

Et tu styles ces deux titres dans ta CSS, comme tu le souhaites.

- Je trouve ça assez bizarre de placer tes liens externes à cet endroit. J'ai cru que c'était ton menu principal (vu que j'y connais rien au modélisme).

Voilà voilà

Courage !

zib · Message par **zib** » 08 oct. 2006, 16:59

depuis, beaucoup de chose on été reglées!!je me suis un peu derouillé tout seul!
le lien du titre c'est seulement parce que je ne savais pas ou placer un lien page d'acueil!
pour les polices, c'est réglé, et justement, entre firefox et ie, les balise<h1>...ne correspondent pas à la même taille de police(du moins j'ai l'impression)
le menu pricipal, c'est le truc qui est à gauche, et là, j'avoue que je l'ai pas fait avec les tables

(mais je sais pas comment m'en servir aussi!

si tu as des remarque sur le site, n'hésite pas à me le dire, je fairai autant de modif que nécessaire pour avoir un site agréable!

Message envoyé avec : Mozilla/4.0 (compatible; MSIE 6.0; Windows NT 5.1; SV1; Orange 7.4 ; NaviWoo1.1; .NET CLR 1.1.4322)

Asumbaa · Message par **Asumbaa** » 09 oct. 2006, 10:02

Salut,

zib a écrit :depuis, beaucoup de chose on été reglées!!je me suis un peu derouillé tout seul!

C'est bien, c'est le meilleur moyen

zib a écrit :le lien du titre c'est seulement parce que je ne savais pas ou placer un lien page d'acueil!

Par convention, on met généralement un tel lien sur le logo (s'il existe) ou sur le titre principal, donc c'est bon.

zib a écrit :pour les polices, c'est réglé, et justement, entre firefox et ie, les balise<h1>...ne correspondent pas à la même taille de police(du moins j'ai l'impression)

C'est tout à fait possible. C'est pour ça qu'il faut spécifier dans ta feuille de style comment tu souhaites qu'il apparaisse. Mais tu peux aussi bien laisser le style par défaut, car l'idée n'est pas que ça ait "la même tête sur tous les navigateurs" mais que ça soit "lisible avec tous les agents utilisateurs".

zib a écrit :le menu pricipal, c'est le truc qui est à gauche, et là, j'avoue que je l'ai pas fait avec les tables (mais je sais pas comment m'en servir aussi!

J'avais compris, finalement

Ce n'est pas avec une table qu'il faut le faire, mais avec une liste (ul - li) stylée. Dans ton cas ce ne sera pas très compliqué.

Bon courage !

Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.8.0.7) Gecko/20060909 Firefox/1.5.0.7

zib · Message par **zib** » 09 oct. 2006, 18:35

ça me fait plaisir de voir que je me fais comprendre.

maintenet, le seul problème, c'est le menu, j'ai beau regarder, il y en a qui me plaise mais que j'érrive pas à intégrer dans la page!
celui-ci me plaisait bienhttp://www.ibilab.net/webdev/articles/C ... mple-4.htm mais je ne suis pas arrivé à le mettre dans lemenu et encore moins à le faire marcher!!

Message envoyé avec : Mozilla/4.0 (compatible; MSIE 6.0; Windows NT 5.1; SV1; Orange 7.4 ; NaviWoo1.1; .NET CLR 1.1.4322)

zib · Message par **zib** » 09 oct. 2006, 19:09

voila ce que j'ai fait, seulement en copier coller et ça marche pas du tout. de l'aide

svp

code

j'ai supprimer ce qui ne concernais pas le menu)
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

<title>Le site perso de Zib</title>
<link rel="stylesheet" href="http://perso.orange.fr/zib.c/blog/styles-site.css" type="text/css" />
<script type="text/javascript">
function hover(obj){
if(document.all){
UL = obj.getElementsByTagName('ul');
if(UL.length > 0){
sousMenu = UL[0].style;
if(sousMenu .display == 'none' || sousMenu.display == ''){
sousMenu.display = 'block';
}else{
sousMenu.display = 'none';
}
}
}
}

function setHover(){
LI = document.getElementById('menu').getElementsByTagName('li');
nLI = LI.length;
for(i=0; i < nLI; i++){
LI.onmouseover = function(){
hover(this);
}
LI.onmouseout = function(){
hover(this);
}
}
}
</script>

<style type="text/css">
ul#menu li ul{
display:none;
}

ul#menu li:hover>ul{
display:block;
}

ul#menu,
ul#menu ul{
list-style:none;
margin:0px;
padding:0px;
}

ul#menu ul{
position:absolute;
top:-1px;
left:148px;
}

ul#menu li{
position:relative;
margin:0px;
padding:0px;
_display:inline;
}

ul#menu a{
display:block;
width:100%;
color:#000000;
text-decoration:none
}

ul#menu a:hover{
background:#000000;
color:#FFFFFF;
}
</style>

</head>

<body onload="setHover()">
<div id="conteneur">
<div id="banner">
<a href="http://perso.orange.fr/zib.c/">Le site perso de Zib</a><br>
<span class="description">le modélisme naval radiocommandé</span>
</div>


<div id="links">
<ul id="menu">
<ul>
<li><a href="#">Pourquoi l'électrique?</a></li>
<li><a href="#">Quelles catégories?</a></li>
<li><a href="#">Les moteurs</a></li>
<li><a href="#">Les accus</a></li>
<li><a href="http://perso.orange.fr/zib.c/blog/index.html">Mes constructions</a></li>
<li>
<a href="#">Mes photos/vidéos</a>
<ul>
<li><a href="#">Micro rigger 1</a></li>
<li><a href="#">Micro rigger 2</a></li>
</ul>
</li>
<li><a href="#">Un peu de théorie?</a></li>
<li><a href="#">Un peu de calcul?</a></li>
<li><a href="http://perso.orange.fr/zib.c/formulaire.html">Un commentaires?</a></li>
<li><a href="http://perso.orange.fr/zib.c/formulaire.html">Des questions?</a></li>
</ul>
</ul>
</div>

Message envoyé avec : Mozilla/4.0 (compatible; MSIE 6.0; Windows NT 5.1; SV1; Orange 7.4 ; NaviWoo1.1; .NET CLR 1.1.4322)

Asumbaa · Message par **Asumbaa** » 10 oct. 2006, 10:18

Salut,

Je n'ai pas trop le temps de vérifier, mais déjà ce qui me saute aux yeux c'est que tu as imbriqué deux ul :

Code : Tout sélectionner

<ul id="menu">
<ul>
<li>

Essaye déjà en supprimant le deuxième ; ainsi tes styles seront appliqués (dans la CSS, ul#menu li s'applique aux éléments de liste de ton ul d'identifiant "menu".).

A noter : le petit bout de Javascript ne sert qu'à Internet Explorer. Les navigateurs modernes, eux, comprennent les pseudo-classes CSS "hover" sur les li. Donc pense bien à tester sur IE et Firefox (ou autre navigateur moderne). Si tu utilises, comme le laisse suggérer ta signature, un navigateur basé sur IE sans Javascript (pour téléphone mobile), c'est normal que rien ne fonctionne.
C'est en ligne, là, on peut tester ?

Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.8.0.7) Gecko/20060909 Firefox/1.5.0.7

zib · Message par **zib** » 10 oct. 2006, 19:26

merci pour l'astuce, maintenant ça marche mais sur IE ça fait un truc foireux tout pas beau!comment je peu faire pour résoudre ce prob?
sinon, que pense tu du menu mainteant?est-ce que le noir rend bien?

Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.8.0.7) Gecko/20060909 Firefox/1.5.0.7

Asumbaa · Message par **Asumbaa** » 11 oct. 2006, 10:03

Hop

Alors...
Déjà, régler le rendu moche sous IE :
- Tu constates qu'il n'applique pas certaines instructions CSS sur tes "li". C'est pas grave, c'est juste que tu les as mises dans ta CSS sur le ul#menu ul au lieu de les mettre sur les ul#menu li. A première vue il faudrait écrire dans ta CSS un truc du genre

Code : Tout sélectionner

ul#menu {
  background-color: #000000;
  font-size: 9px;
  color :#ffffff;
  width:100%;
  list-style:none;
  margin-left:15px;
  padding:0; /* inutile de préciser px si c'est 0 */
  width:118px;
  _width:120px;
}
ul#menu li{
  text-transform: uppercase;
  width:100%;
  list-style:none;
  margin: 0;
  padding: 0;
}

Enfin, à peaufiner, là je ne peux pas tester vraiment.
Je te conseille l'excellente extension Firefox WebDeveloper qui te permettra de mieux comprendre quel style est appliqué sur quel élément, pour identifier ce genre de problèmes.

Il faudra aussi sans doute styler tes sous-menus de la même façon pour virer les puces.

Sinon, le noir moi j'aime bien. Ce n'est pas le cas de tout le monde, mais normalement écrit blanc sur fond noir le contraste est OK pour tout le monde. Sur un menu ce n'est pas fatigant pour les yeux. Et j'aime bien l'effet tout simple que tu as mis au survol.

Si tu ne t'en sors pas, je regarderai chez moi en faisant des tests, mais là il faut que je travaille un peu

Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.8.0.7) Gecko/20060909 Firefox/1.5.0.7

zib · Message par **zib** » 11 oct. 2006, 21:13

merci, j'ai essayer ce que tu m'as dit de faire, ça fait pas gran chose sous IE, j'ai mis links : text-aligne center, et pour center le menu : menu : margin left--right:auto, ça rend bien sous ff mais sous IE, c'est toujours la cata!

Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.8.0.7) Gecko/20060909 Firefox/1.5.0.7

Asumbaa · Message par **Asumbaa** » 12 oct. 2006, 09:57

Salut,

Oui, tu as toujours les puces sous IE. Essaye d'identifier lesquelles c'est pour pouvoir les enlever dans la CSS, en même temps que les margin - padding.

Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.8.0.7) Gecko/20060909 Firefox/1.5.0.7

zib · Message par **zib** » 12 oct. 2006, 18:23

on ne voit pas les puces sous IE!, ya juste un énorme décalage!

Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.8.0.7) Gecko/20060909 Firefox/1.5.0.7

zib · Message par **zib** » 12 oct. 2006, 19:13

mettons que je prennent le même code que ça, est-ce que ça va marcher?
http://www.ibilab.net/webdev/exemples/m ... emple1.htm

Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.8.0.7) Gecko/20060909 Firefox/1.5.0.7

Asumbaa · Message par **Asumbaa** » 13 oct. 2006, 09:47

Salut,

Oui, ça a l'air de fonctionner sous IE ce code.
Mais le tien aussi fonctionne, je soutiens que tu as juste un souci de CSS.
Hier je voyais encore les puces, mais ta CSS était peut-être bien en cache.

Persévère, tu y es presque

Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.8.0.7) Gecko/20060909 Firefox/1.5.0.7

Geckozone

problème avec mon site

problème avec mon site

Qui est en ligne ?