6
votes

Curseur de sélection de texte CSS IE7, comportement étrange

étrange ici, dans l'espoir d'obtenir des commentaires pour me pointer dans la bonne direction.

Si mon #wrapper ou l'un des divs enfants n'a pas de couleur de fond qui leur est appliquée , IE7 modifie le curseur normal "pointeur" dans un curseur "Select-Select" "lors de la souris autour de la page (sournois sur le texte ou non).

Je pensais avoir réparé le problème un moment, mais Lorsque je retire la couleur de fond de mon #wrapper ou l'un des enfants enfants, le problème réapparaît.

Juste chercher des indices ou ce que je devrais vérifier. xxx

EDIT:

semble être parce que les divs "haslayout", mais je ne sais toujours pas comment le réparer . Voir Ce lien.

< Strong> Edit 2:

Je ne trouve plus d'informations sur ce "bug ie7". Toute personne qui a des idées, ou même si vous êtes au courant de ce bogue et que vous pouvez simplement me faire savoir, je sais que je ne suis pas fou. Je suis vraiment frustré par Microsoft. Je vous ai déjà coûté quelques heures de travail supplémentaires cette semaine. On dirait que ça ne finit jamais.

Edit 3:

Voici Un autre lien de quelqu'un ayant le même problème.

edit 4:

Stackoverflow.com souffre de ce bogue! Donc, Mashable.com . Je garantis que de nombreux devs Web ont ce bogue sur leur site et ils ne le savent même pas.

Vérifiez-le pour vous-même ... Placez votre curseur autour de la page de l'un ou l'autre site. Remarquez qu'il se tourne vers un curseur de Select-Select quand il ne devrait pas le faire.

semble être facile de corriger la propriété curseur , mais le problème déclencherait du texte approprié. -Sélectionner le comportement du curseur lorsque nécessaire.


9 commentaires

Pourriez-vous indiquer un exemple en direct? Je ne suis pas sûr que le problème soit dans ces lignes ...


Yep, exemple en direct sur le lien que je viens de poster. Téléchargez le fichier sur la page de test et ouvrez-le à IE7 pour le voir.


Tu n'es pas fou. Et j'ai trouvé d'autres problèmes que les causes de haslayout, mais pas de solution encore.


J'ai trouvé cet espoir qu'il aide: satzansatz.de/cssd/onhavinglayout.html


Essayez-les, faites le premier (je n'aime pas vraiment parce qu'il utilise un commentaire conditionnel): bytesizecsss.com/blog/post/fix-haslayout-with-one-line-f-css CSSCreator.com/node/25082 Brunildo .Org / Test / BackgroundERLAYOUT.HTML


Je pense que le problème est que les divs ont déjà des haslayout (largeur). Hehe, c'est le problème. J'ai besoin de le supprimer.


Je ne comprends pas, quel est le problème? Pourquoi le curseur compte-t-il?


Demandez-vous cela parce que c'est un bug que, pour le bien de l'humanité, une solution devrait être trouvée pour, ou y a-t-il un problème particulier que vous essayez de résoudre? (E.G. est le mauvais curseur juste disgracieux ou désactive l'accessibilité à un groupe d'utilisateurs?). Sachant que cela pourrait nous aider à trouver un compromis.


Je demandais parce que je suis un perfectionniste et j'essayais de faire l'apparence de mon "cadre" de WordPress / se comporter exactement la même chose dans le moins de navigateurs que possible. IE7 est un navigateur très populaire et sera depuis quelque temps, alors j'espérais trouver une solution à l'amiable pour un «bug / bizarrerie» que peu de gens semblaient être au courant.


7 Réponses :


0
votes

Avez-vous essayé de régler Couleur de fond: transparent; explicitement? Est-ce que cela aide?


3 commentaires

Yeppers, essayé. Ne fonctionne pas. Je suppose que j'espère que quelqu'un peut me donner quelque chose à "Google". Semble étrange que pas beaucoup de gens n'en ont déjà vécu.


Dommage: je pensais que Transparent serait suffisant d'un "fond" pour le maintenir. Je suppose que tu ne veux pas de fond? Sinon, vous pouvez en ajouter un dans une feuille de style IE7 via des commentaires conditionnels. Semble l'un de ces bugs rendu pour lesquels il n'y a pas de solution de contournement décent. (JavaScript?) Désolé je ne pouvais pas m'empêcher.


Ouais, ma seule idée jusqu'à présent est de mordre mon CSS et de mettre un couleur qui correspond à la partie principale de mon site - juste pour IE7, lol.



0
votes

Cela peut sembler comme un hack moche, mais avez-vous essayé de définir un gif de 1x1 px transparent (AKA spacer) comme arrière-plan?


1 commentaires

Je n'ai pas essayé cela, mais si cela vient à cela, je pense que je préférerais simplement définir une couleur de fond à la place. Bonne suggestion, cependant.



0
votes

Ce n'est pas parfait, mais pour ce petit exemple, il semble fonctionner pour IE 7.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
</head>
<body>
<div style="overflow: hidden; margin: 0 auto; width: 140px;">
   <div style="position: relative; display: inline;">
      <p>
         Here is some test text that will wrap.
      </p>
   </div>
</div>
</body>
</html>


0 commentaires

1
votes

Je suis à peu près sûr que je l'ai déjà rencontrée, mais c'est probablement un peu trop subtile pour vraiment remarquer lors de certains tests de navigateur superficiels. Mais j'ai certainement aussi des problèmes résolus en définissant une couleur de fond.

Autant que je puisse dire, la meilleure façon de le réparer est de positionner l'élément provoquant des problèmes, ou d'ajouter une enveloppe placée positionnée. Vous utiliseriez probablement position: relative , bien que absolu et fixe devrait fonctionner aussi.

Positionnement de l'élément lui-même fonctionne généralement, mais l'ajout d'un wrapper div pourrait fonctionner plus systématiquement.

E.g. Ajout de Position: relative au .post-texte-texte corrige le curseur sur les questions et réponses sur cette page.


2 commentaires

Ajout de Position: relatif; à mon #wrapper n'a fait aucune différence pour moi. Quant à emballer mon enveloppe, eh bien, je suppose que je préférerais vivre avec le curseur curieuse. =)


Assez juste. Je suis curieux, cependant, ajoute-t-il l'enveloppe de positionnée supplémentaire qui le réalise?



3
votes

Est-ce trop hacky pour énoncer explicitement quel curseur devrait aller où? XXX

etc ..


3 commentaires

Cela ne le répare toujours pas entièrement. Le curseur de texte apparaît alors sur tout le bloc, y compris tout rembourrage et espace vide sur une dernière ligne partiellement remplie, par exemple, au lieu de simplement le texte réel.


D'accord. Super idée, une fois que j'ai déjà essayé, mais ne le coupe pas pour la raison citée par Mercator.


Hmmm, besoin de que précise, n'est-ce pas? Oh cher .. S'il vous plaît voir mon commentaire sur la question demandant un peu plus d'informations sur le raisonnement.



0
votes

La solution de Delilah, seul un peu simplifié fonctionne bien pour moi et résout également le problème de Mercator.

div { cursor: default; }
div * { cursor: auto; }


0 commentaires

1
votes

Le GIF PX transparent 1x1 px fonctionne et est également une excellente solution pour Ce et d'autres bugs dans IE 6 à 8h. J'ajouterais quelque chose comme ça à mes commentaires conditionnels pour tout IE:

* {
    background: url('images/fix1.gif');
}


0 commentaires