1
文字でフィルタリングできる画面名のリストがあります。私が抱えている問題は、ブラウザーウィンドウが1〜5レベルからズームアウトされると、zはFirefoxの次の行に折り返され、いくつかの文字はクロムにラップされるということです。 Internet Explorerでは5段階のズームアウトがOKです。ここではサンプルソースは、次のとおりです。ズームイン/アウトでHTML要素が折り返される
<html>
<head>
<style>
.filters { position: absolute; background: #ff0000 0 0 no-repeat; width: 970px; height: 31px; left: 0; text-transform: uppercase; }
.letters { float: left; margin: 2px 0 0 7px; width: 710px; height: 30px; background-color: orange; }
.screenname {width: 244px; background-color: green; float: left; }
.filters .letters a { display: inline; margin: 0 14px 0 0; }
.filters .letters a.disabled { color: #36373a; cursor: default; }
.filters a { font: bold italic 12px/28px Arial, sans-serif; }
</style>
</head>
<body>
<div class="filters">
<div class="screenname">
Screen Name
</div>
<div class="letters">
<a href="#" rel="#">#</a>
<a href="#" rel="A">A</a>
<a href="#" rel="B">B</a>
<a href="#" rel="C">C</a>
<a href="#" rel="D">D</a>
<a href="#" rel="E">E</a>
<a href="#" rel="F">F</a>
<a href="#" rel="G">G</a>
<a href="#" rel="H">H</a>
<a href="#" rel="I">I</a>
<a href="#" rel="J">J</a>
<a href="#" rel="K">K</a>
<a href="#" rel="L">L</a>
<a href="#" rel="M">M</a>
<a href="#" rel="N">N</a>
<a href="#" rel="O">O</a>
<a href="#" rel="P">P</a>
<a href="#" rel="Q">Q</a>
<a href="#" rel="R">R</a>
<a href="#" rel="S">S</a>
<a href="#" rel="T">T</a>
<a href="#" rel="U">U</a>
<a href="#" rel="V">V</a>
<a href="#" rel="W">W</a>
<a href="#" rel="X">X</a>
<a href="#" rel="Y">Y</a>
<a href="#" rel="Z">Z</a>
</div>
</div>
</body>
今すぐHTMLファイル内にクロムとFirefoxの両方で（はCtrl-）5回をズームアウトすることを置きます。ラッピングが発生します。どうすればこれを避けることができますか？フィルタdivのサイズを増やすことはできません。クロムのフォントレンダリング（一部のズームの後にサイズが小さくなる）によって部分的に問題が発生することがあります。私は任意のjavascript/Jqueryハックにも開いている可能性があります。
が、これは本当に重要ですか？誰かが5倍にズームアウトした場合、私は手紙を読むことさえできず、ラップされているかどうか気にする必要はないと確信しています。 – Jordan
もしそれが何か重要でないなら、私は時間を無駄にしてはいけません。幸いなことに、他の誰かが時間をかけて解決策を思いついた。 – user92254225