0

回答を得た私の元の質問 (IE8 でテキストの折り返しまたはドロップダウン ボックスでページの特定の部分のみを使用することについて) はhereです。

@Dogoku によって提案された変更を JSFiddle に実装しました。これは css に次のように記述されていました。

table {
    width:100%;
    table-layout: fixed;
}

.breakword {
-ms-word-break: break-all;
word-break: break-all;
// Non standard for webkit
     word-break: break-word;
-webkit-hyphens: auto;
-moz-hyphens: auto;
hyphens: auto;
font-size: 0.9em; font-weight: normal;
}

.choices {
    max-width: 100%
}

そしてこれをHTMLで:

<table width="100%" style="table-layout:fixed;">
    <tr>
        <td>kokos</td>
        <td class="breakword" style="width:54%">
            <select name="vlist" id="vlist" class="choices">
                <option value="15">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</option>
                <option>This is a test item for the dropdown</option>
            </select>
        </td>
    </tr>
</table

同じバージョンの IE8 を使用する 2 つの異なる PC では、動作が異なります。あるバージョンでは、(長い) ドロップダウン テキストが 1 行表示されるだけで、期待どおりに動作します。ドロップダウン ボックスには、ボックスに表示される下向き矢印があり、それをクリックすると、期待どおりにドロップダウンが展開されます。選択が行われ、正常に機能します。

他の PC では、ドロップダウン ボックスは表示されますが、下矢印は表示されません。ユーザーがボックスをクリックすると、期待どおりに機能します (ドロップダウンにすべての項目が表示され、長いテキストの 1 行が表示されます)。ユーザーはそれを選択でき、選択が行われると期待どおりに機能します。

正常に表示・動作するのは、Windows 7 32ビットOS、IE 8.0.7601.17514です。正常に表示されないのは、Windows 7 64 ビット OS で、同じバージョンの IE8 です。また、このシステムでは保護モードが有効になっています。OSとその単一の設定以外に、2つの違いを見つけることができません。

私が気付いていることの 1 つは、2 番目の PC で影響を受けるドロップダウンは、提供されたスペースの量を超えて拡張されるコンテンツを含むドロップダウンのみであるということです。境界を超えるコンテンツを持たないその他のドロップダウンには、矢印が表示された通常の外観のドロップダウン ボックスがあります。

ドロップダウンで何が見落とされていますか? CSS の設定だと思いますが、まだ試したことはありませんが、各システムで同じように機能するようにはなりません。助けや提案をいただければ幸いです。

4

1 に答える 1