Problème de largeur avec Ext.Panel bbar dans IE 6

Je viens de rencontrer un problème d'affichage dans IE6 avec le framework ExtJS. - J'espère que quelqu'un peut me diriger dans la bonne direction.Problème de largeur avec Ext.Panel bbar dans IE 6

Dans l'exemple suivant, le bbar du panneau est affiché 2s plus étroit que le panneau auquel il est attaché (il est aligné à gauche) dans IE6, où comme dans Firefox il est affiché avec la même largeur que le panneau.

Quelqu'un peut-il suggérer comment résoudre ce problème?

Je semble pouvoir contourner soit en spécifiant la largeur du panneau dans ems ou le remplissage en pixels, mais je suppose qu'il devrait fonctionner comme je l'ai ci-dessous.

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
<html> 
<head> 
    <link rel="stylesheet" type="text/css" href="ext/resources/css/ext-all.css"/> 
    <script type="text/javascript" src="ext/ext-base.js"></script> 
    <script type="text/javascript" src="ext/ext-all-debug.js"></script> 
    <script type="text/javascript"> 

    Ext.onReady(function(){   
     var main = new Ext.Panel({ 
      renderTo: 'content', 
      bodyStyle: 'padding: 1em;', 
      width: 500, 
      html: "Alignment issue in IE - The bbar's width is 2ems less than the main panel in IE6.", 
      bbar: [ 
        "->", 
       {id: "continue", text: 'Continue'} 
      ] 
     }); 
    }); 

    </script> 
</head> 
<body> 
    <div id="content"></div> 
</body> 
</html>

Source

2008-09-18 Matt Sheppard

Le problème provient du remplissage de bodyStyle personnalisé. Cela agrandit le contenu du panneau, mais pas la barre d'outils.

Une solution possible est nicher en outre un panneau Poste, comme:

var main = new Ext.Panel({ 
     renderTo: 'content', 
     width: 500, 
     items: { 
      bodyStyle: 'padding: 1em;', 
      border: false, 
      html: "Now alignment is fine." 
     }, 
     bbar: [ 
       "->", 
      {id: "continue", text: 'Continue'} 
     ] 
    });

La frontière: false est nécessaire pour éviter la double bordure.

Source

2008-09-19 17:09:05 tsg

Peut-être que vous devriez essayer de forcer la largeur de la bbar:

main.getBottomToolbar() setLargeur (500);.

juste après la création du panneau?

Mais je pense que le problème est que bbar est rendu dans div interne du panneau, de sorte que les navigateurs différents interprètent différemment rembourrage externe.

Vous pouvez également essayer de définir le remplissage du bbar à -1em.

Source

2008-09-18 16:32:24 Thevs

Problème de largeur avec Ext.Panel bbar dans IE 6

Répondre

Questions connexes