Question

J'essaie d'identifier ce bug. Est-ce déjà un problème connu ou est-ce totalement nouveau? Existe-t-il une solution de contournement (comme un zoom: 1 ou une position: relative que je peux ajouter pour le corriger?), Idéalement sans modifier le code HTML ici, mais simplement en y ajoutant.

Si vous affichez le code HTML ci-dessous dans IE8, le texte de la liste déroulante (liste déroulante) s’affiche deux fois. Un en dehors de la zone de liste déroulante. Cela perturbe le flux de mon document (pour ne pas dire bizarre).

<html><body>
<div style="width: 800px;">
 <div style="float: right" >     
 </div> 
 <div style="display: none">
     ijklmno
 </div>
 <div style="float:left">
  <select>
   <option>abcdef</option>
  </select>
  <div style="float: right">
  </div>
 </div>
</div>
</body></html>
Était-ce utile?

La solution

C’est définitivement un bogue, car vous êtes assez explicite dans les règles de style de mise en page. Mais c'est aussi un arrangement vraiment étrange pour commencer. Si vous affichez le div masqué, ajoutez du texte OU masquez le div sous la sélection, le problème disparaît. Ma meilleure hypothèse est que, puisque vous avez des éléments de niveau de bloc qui se chevauchent avec un élément caché et un élément vide, IE ignore le flottant et essaie de les lier les uns sur les autres, ce qui force l'option vers le bas, mais puisque la sélection reste en place, il affiche également l’option dans la sélection.

Très étrange et une prise très cool. Selon moi, vos options consistent à ajouter du contenu au dernier div (probablement un espace insécable) ou à le masquer (affichage: aucun), ou aux deux.

Dans Firefox, cette dernière division ne flotte pas non plus à droite et se chevauche avec l'élément select (vous pouvez le voir en décrivant les éléments de niveau bloc avec la barre d'outils de développeur), ce qui me fait penser que Firefox est tout simplement meilleur pour la gestion des éléments superposés au niveau des blocs. .

Si vous définissez la dernière div avec une bordure, vous verrez qu'elle ne flotte pas à droite de la div principale.

Licencié sous: CC-BY-SA avec attribution
Non affilié à StackOverflow
scroll top