5568 sujets

Sémantique web et HTML

Smiley rolleyes
bonjour
j'aurais de nouveau besoin d'aide pour la compatibilité d'un site entre IE et FF !
voici l'adresse:
http://www.sas-evenement.fr/
Smiley decu
la page d'accueil ne pose pas de problème mais dès que l'on rentre dans le site, le menu de droite est bien "collé" en haut de page et ne bouge pas lorsque l'on scrolle sous IE
... mais sous FF c'est une autre paire de manches ... il réagit tout à fait différemment ....
je pense (moi .... avec mes petites connaissances !) qu'il y a un problème de code MAIS aussi au niveau du fichier css
alors : à l'aide !
si vous avez besoin de certains codes dîtes-le !
@mitiés
b g
Modifié par Florent V. (21 Aug 2007 - 11:35)
Bonjour,

Est-ce que ça ne serait pas plutôt du côté du Javascript ?
  <script type="text/javascript">
  function SuitScrollBar()
  {
    document.getElementById("menu").style.top = document.body.scrollTop; 
  }
    SuitScrollBar();
    window.onscroll=SuitScrollBar;
  </script>
Désactive-le pour voir.
 
Bonjour,

Pour ma part, j'aurais tendance à dire «on efface tout et on recommence».

Pour commencer, ce site manque cruellement d'une charte graphique convenable. Même une très simple pourrait convenir.

Ensuite, il y aurait besoin d'une petite réflexion sur la communication. Moins de gadget, plus de contenu et une offre de communication directe, moins parasitée par du machin qui bouge pour rien. Les machins qui bougent ne sont pas forcément inutiles, mais là ils le sont.

Sur la technique:
- la page d'accueil (inutile?) en tableau genre découpé dans Image Ready, c'est un peu pas terrible...;
- un Doctype HTML 4.01 Transitional tronqué, c'est-à-dire auquel il manque l'URL de la DTD, ce qui fait passer les navigateurs en mode Quirks (très mauvais idée);
- des liens (ne menant nulle part) sur les titres h1... mauvais plan;
- etc.
merci à gihef et à florent pour ces réponses
je suis en train de revoir ce site (qui n'est pas le mien !) en local et quelques modifs commencent à faire effet
pour gihef: le java script n'entre pas dans le problème, c'est bon
pour florent:
la page d'accueil est pour le look ! Smiley biggol
le doctype est corrigé et c'est meilleur comme effet, merci
les liens je vais en mettre quelques-uns
le problème qui me reste est le 'fond' gauche et centre qui s'affiche correctement sous IE mais sous FF il s'arrête bien avant le bas de la page, cela fait affreux ....
là ce doit être un problème de "css" , voici le code:
body, html {
height: 100%;
margin: 0;
padding: 0;
background : #fff url(../images/bg4.jpg) fixed;
font-size :1em;
font-family: Arial, Verdanna, Helvetica, sans-serif;
}
html { 
overflow:auto; 
} 
body { 
overflow: auto; 
} 
#menu {
position:absolute;
margin-top : 10px;
/*margin-left: 760px !important;*/
margin-left: 800px ;
text-align:left;
list-style : none; 
font-size :0.75em !important;
font-weight: bold;
}
#menu li {}
#menu li a{
display : block ; 
text-decoration : none;
color : #0AFF0A;
margin : 1px 0 0 0 ;
text-transform : uppercase; 
line-height : 20px ; 
border-bottom : 1px dotted #ccc;
width : 150px; 
}
#menu li a:hover{
color : #FF850A;
text-decoration : none;
 text-indent :20px; 
}
ul[id=menu] {
position: fixed !important;
}
html > body {
overflow: visible !important;
}
#content{
width:790px;
background : #fff url(../images/bg_new.jpg) repeat-y ;}
html>body #content {height : auto; min-height : 100%;  }
.haut {width : 790px ; height : 180px ; background : url(../images/sas04.gif)}
#gauche {
width : 200px ;
float : left;
margin-left : 0; 
padding-bottom :100px;
/*text-align:justify;*/
 }
#gauche p{
padding : 0 ; margin : 5px 20px 0 20px}
#droite {
width : 590px ;
background: transparent; 
float : left;
margin-left : 0; 
padding-bottom : 40px; 
text-align:left;
/*font-size :1.2em;*/
color: #FFFFFF !important;
letter-spacing:1px;
}
/*#droite p{
padding : 0 ; margin : 5px 20px 0 20px}
 h1 {
 margin : 20px 20px 20px 20px; 
 border-bottom : 1px dotted #000 ; 
 line-height : 30px ; 
 padding-botom : 20px ; 
 font-size : 1.2em; 
 text-transform : uppercase ; }*/
 #droite p{
padding : 0 ; margin : 5px 20px 0 20px}
 h1 {
 margin : 20px 20px 20px 20px; 
 border-bottom : 1px dotted #000 ; 
 line-height : 30px ; 
 padding-botom : 20px ; 
 /*font-size : 1.5em; */
 font-size : 1.3em;
 text-transform : uppercase ; }
 
/* inutile pour ici
  h1 span{
font-size : 0.6em ; font-style : italic ; text-transform : none }
*/
 h2 {
	font-family: Arial, Verdanna, Helvetica, sans-serif;
	font-size: 1em;
	color: #000000;
    letter-spacing:1px;
}
 .imgdroite {float : right  ; margin : 0 0 10px 10px } 
 .imggauche {float :left  ; margin : 0  10px 10px 0 } 
  a {text-decoration : none ; color : #0AFF0A}
  a:hover {text-decoration : none ; color : #FF850A}
  
#footer {
background:#8b8b8b url(../images/footerbg.jpg) top left repeat-x;
clear:both;
color:#d0d0d0;
font-size:0.89em;
font-weight:bold;
margin:0;
padding:20px 0;
text-align:center;
}
#footer a {
color:#d0d0d0;
font-weight:bold;
}
#footer a:hover{
color : #FF850A;
text-decoration : underline ! important;
}


je pense à la ligne :
" background : #fff url(../images/bg_new.jpg) repeat-y ;} "
cela doit coincer par là .... Smiley rolleyes mais je ne trouve pas malgré quelques essais
@mitiés
b g
bg62 a écrit :
le problème qui me reste est le 'fond' gauche et centre qui s'affiche correctement sous IE mais sous FF il s'arrête bien avant le bas de la page, cela fait affreux ....

Non, le fond ne s'arrête pas. C'est le conteneur qui porte le fond qui s'arrête, car ses éléments enfants sont flottants et donc dépassent. Ce conteneur (div#content) prend donc une hauteur de 100% de la zone de visualisation (viewport) grâce au min-height: 100%, et basta.

Un petit overflow: hidden sur div#content améliore sensiblement les choses.

Pour en savoir plus, faire une recherche sur le dépassement des flottants.
Smiley eek merci Florent
Smiley biggol comment peut-on être aussi 'balaise' sur le sujet ????
moi je galère lamentablement !
j'ai mis ceci dans la css:
#content{
width:790px;
overflow: hidden;
background : #fff url(../images/bg_new.jpg) repeat-y ;}

et cela semble fonctionner (sauf une image mal centrée dans la colonne de gauche)
mais ici en local sous easyphp
je viens de mettre la correction en ligne et ça ne change rien ....
http://www.sas-evenement.fr/pages/accueil.php
je crois que je vais craquer !
@mitiés
b g
Modifié par Florent V. (21 Aug 2007 - 17:51)
bg62 a écrit :
je viens de mettre la correction en ligne et ça ne change rien ....

De même pour moi... avant que je ne vide le cache du navigateur. Smiley cligne
Smiley eek donc pour toi ce serait bon ou pas .... ?
je remets une mise à jour en ligne cet après-midi ...
pourrais-tu regarder ?
@mitiés
b g