Forum |  HardWare.fr | News | Articles | PC | S'identifier | S'inscrire | Shop Recherche
2966 connectés 

  FORUM HardWare.fr
  Programmation
  HTML/CSS

  Problème IE/Mozilla

 


 Mot :   Pseudo :  
 
Bas de page
Auteur Sujet :

Problème IE/Mozilla

n°1488957
jeromeke
Posté le 09-12-2006 à 09:16:29  profilanswer
 

Bonjour,
 
au lieu d'insérer une hauteur j'ai voulu insérer la position de départ du dessus et du haut de mon div,
afin qu'il prenne toute la hauteur.
 
Ca marche avec FF mais pas sous IE,
 
quelle est la solution?
 
http://jerome.monprojet.info/Taekwondo
 

Citation :


#back
 {
 position: absolute;
top: 342px;
 bottom: 10px;
 width: 850px;
 background-image: url(images/background.gif);
 background-repeat: repeat-y;  
 }


 
Mes border aussi semblent buguer :(
 
Update: une chose étrange se passe lorsque j'ouvre mon fichier css sous IE (qui l'ouvre alors dans FrontPage), le ' ; ' derriere les repeat-y ont disparu... Aussi derrière  no-repeat ...  :??:  :??:  :??:  :??:  :??:  :??:  :??:  :??:  :??:


Message édité par jeromeke le 09-12-2006 à 09:46:00
mood
Publicité
Posté le 09-12-2006 à 09:16:29  profilanswer
 

n°1488960
gebruik
Posté le 09-12-2006 à 09:41:33  profilanswer
 

En CSS, le ';' de la dernière propriété n'est pas une obligation. C'est pour cette raison qu'il n'y en a pas nécessairement lorsque tu utilises un attribut style juste pour une propriété dans une balise.
 
Pour visualiser le résultat de ta page aussi bien dans IE que dans Firefox, pense à mettre quelques chose à afficher dans tes div, ne serait-ce qu'une espace insécable ou un caractère. Là il n'y a rien, ça peut parfois poser problème, y compris sur les éléments positionnés en absolu.
 
Autre remarque : évite les div à outrance et profite du fait que certains éléments sont de type block pour les positionner (comme pour tes menus).

n°1488962
jeromeke
Posté le 09-12-2006 à 09:52:13  profilanswer
 

Merci!
 
J'ai mis des espaces mais ça ne semble toujours pas marcher...
Je trouve ça aussi bizarre qu'il fait un repeat-y pour une dizaines de pixels sous IE et qu'il s'arrête ensuite :/


Message édité par jeromeke le 09-12-2006 à 09:52:30
n°1488965
gebruik
Posté le 09-12-2006 à 09:54:27  profilanswer
 

Espace insécable :
& n b s p ;

n°1488966
jeromeke
Posté le 09-12-2006 à 09:57:36  profilanswer
 

Je pensais que quand il sagissait que d'une seule espace on pouvait bêtement tapper espace?
 
J'ai mis   : même résultat :(


Message édité par jeromeke le 09-12-2006 à 10:05:20
n°1488969
gebruik
Posté le 09-12-2006 à 10:00:45  profilanswer
 

Pourquoi tu as tout positionné en absolu ?

n°1488971
jeromeke
Posté le 09-12-2006 à 10:04:48  profilanswer
 

Euuuuh, c'est comme ça qu'on apprend à l'école :/
Positionner en absolut donc à partir du parent element précédent: le body, non?

n°1488974
gebruik
Posté le 09-12-2006 à 10:16:27  profilanswer
 

En positionnement absolu, ton élément sort du flux pour être positionné par rapport à son conteneur parent, l'élément body dans ton cas.
En fait, le positionnement en absolu est une mauvaise habitude puisqu'elle reprend la logique de positionnement par tableau qui est à banir maintenant.
 
Dans la pratique, les éléments de type block s'affichant les uns en dessous des autres : lorsque tu affiches deux paragraphes (de type block donc), le second se place sous le premier et pas à la suite.
En utilisant cette propriété, tu peux parfaitement positionner des éléments sans avoir recours au positionnement absolu, lequel je rappelle sort l'élément du flux de lecture.
 
Exemple concret : tu utilises une balise div appelée menu pour y mettre surement un menu, menu qui sera en fait une liste non ordonnées, donc une balise ul encadrant des balises li.
ul est un élément de type block, tu n'as donc pas besoin de passer par un conteneur div et tu peux écrire <ul id="menu"> et affecter des propriétés à cet élément.
 
Le risque avec le positionnement absolu est de multiplier à outrance les balise div qui n'ont sémantiquement aucun sens.
En gros, tu remplaces tes balises td de tablleau par des conteneurs. Et si c'est ce qui est enseigné, c'est fort regrettable.
 
Essaie pour visualiser ton problème de mettre des espaces insécables dans toutes tes balises div et accessoirement, affecte une couleur de fond différente pour chacun histoire de bien comprendre ce qui se passe.
A l'occasion, sous FF, tu peux utiliser l'add-on web developer dispo sur le site de Mozilla.

n°1488975
jeromeke
Posté le 09-12-2006 à 10:22:41  profilanswer
 

Merci beaucoup! Je vais essayer tout ça ce week-end!
 
Oui je viens d'apprendre les divs (j'utilisais que des tableaux au par avant), c'est pas façile pour commencer avec tous les problèmes d'affichage :(
 
A++
 

n°1489313
jeromeke
Posté le 10-12-2006 à 22:48:55  profilanswer
 

Bonjour, j'ai essayé de résoudre mon problème ce weekend en utilisant le moins de position: absolute possible et en travaillant avec des margin mais tout se déplace et il n'y a plus de structure... Je suis perdu...  
 
Quelqu'un pourrait me mettre sur la bonne piste?


Message édité par jeromeke le 10-12-2006 à 22:52:29
mood
Publicité
Posté le 10-12-2006 à 22:48:55  profilanswer
 

n°1489351
jeromeke
Posté le 11-12-2006 à 04:24:29  profilanswer
 

Le probème ne se pose pas avec IE7...
 
Quand je mets dans mon code juste le left-border avec un background-repeat: repeat-y ça ne marche pas non plus...
 

Citation :

<!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>
<link rel="stylesheet" type="text/css" href="taekwondo.css" />
<title>TAEKWONDO HWARANG LANDEN</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
</head>
<body>
 
<div id="left-border"></div>
 
 
</body>
</html>


Message édité par jeromeke le 11-12-2006 à 04:24:49
n°1496092
gabidospi
Posté le 26-12-2006 à 16:40:08  profilanswer
 

Le background normallement occupe la totalité du contenu. Etant donné que tu n'as rien dedans, il s'affiche pas. Essaye d'utiliser la propriéte height à la place de bottom (tu peux mettre même height:90%)

n°1496097
gabidospi
Posté le 26-12-2006 à 16:50:03  profilanswer
 

Sinon, tu peux utiliser un petit javascript qui calcule en fonction de la hauteur de ta fenetre , la hauteur de ton bloc .
css:
 
#bloc {...}
 
<head>
<script type="text/javascript">
 
window.onload = setHeight;
window.onresize = setHeight;
 
<!--
function getWindowHeight() {
   var windowHeight = 0;
   if (typeof(window.innerHeight) == 'number') { // Netscape
    windowHeight = window.innerHeight;
   }
   else {
    if (document.documentElement && document.documentElement.clientHeight) {
     windowHeight = document.documentElement.clientHeight;
    }
    else {
     if (document.body && document.body.offsetHeight) { //client
      windowHeight = document.body.offsetHeight;
     }
    }
   }
   return windowHeight;
  }
 
 function setHeight(){
  var windowHeight=getWindowHeight();
  var blocElement=document.getElementById('bloc');
   
  blocElement.style.height=(windowHeight-30)+'px'; //si par exemple tu as une entete de 30px
}
 
//-->
</script>


Aller à :
Ajouter une réponse
  FORUM HardWare.fr
  Programmation
  HTML/CSS

  Problème IE/Mozilla

 

Sujets relatifs
Probleme dataset, sgbd acces sur VB.NET...problème de fuite mémoire
[C#] Problème pour sérialiser via une MemoryStream[Java + JFreeChart] Problème de contour
Probleme avec la classe Vector ?![Oracle ASM] Problème d'optimisation de requête suite à migration
JavaScript heureProbleme serveur sql avec easyphp??
probléme de mise a jour[RESOLU] [AJAX] probleme d'envoi d'un "+" par POST
Plus de sujets relatifs à : Problème IE/Mozilla


Copyright © 1997-2022 Hardware.fr SARL (Signaler un contenu illicite / Données personnelles) / Groupe LDLC / Shop HFR