-2
エッジブラウザとクロムでレンダリングが異なる1つのhtmlファイルがあります。 htmlファイル内の異なるラベルの高さと幅を変更して、あるブラウザのUserInterfaceを修正していますが、これはChromeのUIを破壊しています。両方のブラウザでUIを適切に調整することができません。どうすれば解決できますか?助けてください。異なるブラウザでレンダリングが異なる
<!DOCTYPE html>
<html>
<head>
<title>ZZZZ Tab</title>
<link rel="stylesheet" type="text/css"
href="/code/ski/current_1/UI/web/css/aa.css" />
<link rel="stylesheet" type="text/css"
href="/code/ski/current_1/stylesheets/bb.css" />
<script src="/UI/js/app.js"></script>
<script src="/UI/js/cash/ZZZZ.js"></script>
<script src="/sha/js/ui/get.js"></script>
<style type="text/css">
.Total_Label {
font-family: Arial;
font-size: 12px;
font-weight: bold;
color: #003366;
}
</style>
</head>
<body class="Center" onload="page_Load();">
<div style="position: absolute; top: 8; left: 550;">
<input type="button" id="DD" class="si_Button" style="width: 60px;"
tabIndex="1" onClick="onClickDDDD()" value="D" />
</div>
<div style="position: absolute; top: 38; left: 445;">
<input type="button" id="BalButton" class="si_Button"
style="width: 60px;" tabIndex="3" onClick="VltBalance()"
value="Get Bal" />
</div>
<div style="position: absolute; top: 38; left: 550;">
<input type="button" id="DDDD" class="si_Button" style="width: 60px;"
tabIndex="4" onClick="ClickVlt()" value="DD" />
</div>
<div id="zzzz" align="left" style="z-index: 1">
<table border="0" cellpadding='5' cellspacing='5'
style="height: 350px; width: 90%">
<tr>
<td width="15%" class="General" nowrap="nowrap"><span
id="tell_ddraw"></span></td>
<td width="20%" align="right"><span id="tel_Bal"></span></td>
<td width="5%"> </td>
<td width="30%"></td>
</tr>
<tr>
<td width="15%"><select id="vD" name="val" tabindex="2"
onchange="getvB(this);">
</select></td>
<td width="20%" align="right"><span id="vB"></span></td>
<td width="5%"> </td>
<td width="30%"></td>
</tr>
<tr>
<td colspan="3" valign="top">
<table>
<tr>
<td class="Label"><input type="radio" name="BuyOrSell"
id="BuyVal" checked="checked" tabindex="5" /> <label
for="BuyVal">Buy from Val</label></td>
<td class="Label"><input type="radio" name="BuyOrSell"
id="sellToVal" tabindex="6" /> <label for="sellToVal">Sell
to Val</label></td>
</tr>
</table>
</td>
<td valign="top">
<table width="45%" cellspacing="3">
<tr>
<td colspan="3" class="headerTitle" align="center">Bill
Count</td>
</tr>
<tr>
<td class="Label"> Count</td>
<td> </td>
<td class="Label">Value</td>
</tr>
<tr>
<td><input id="bill_100" type="text" tabindex="7" size="4"
maxlength="7" value="0" class="format" format="+ve_number"
onblur="Bill(this)" style="text-align: right;" /></td>
<td class="Label">x 100</td>
<td><input id="bill_100_amt" type="text" tabindex="8"
size="9" maxlength="12" value="$0.00" class="format"
format="+ve_currency" disabled="true" style="text-align: right;" />
</td>
</tr>
<tr>
<td><input id="bill_50" type="text" tabindex="9" size="4"
maxlength="7" value="0" class="format" format="+ve_number"
onblur="Bill(this)" style="text-align: right;" /></td>
<td class="Label">x 50</td>
<td><input id="bill_50_amt" type="text" tabindex="10"
size="9" maxlength="12" value="$0.00" class="format"
format="+ve_currency" disabled="true" style="text-align: right;" />
</td>
</tr>
<tr>
<td><input id="bill_20" type="text" tabindex="11" size="4"
maxlength="7" value="0" class="format" format="+ve_number"
onblur="Bill(this)" style="text-align: right;" /></td>
<td class="Label">x 20</td>
<td><input id="bill_amt" type="text" tabindex="12" size="9"
maxlength="12" value="$0.00" class="format"
format="+ve_currency" disabled="true" style="text-align: right;" />
</td>
</tr>
<tr>
<td><input id="bill_10" type="text" tabindex="13" size="4"
maxlength="7" value="0" class="format" format="+ve_number"
onblur="Bill(this)" style="text-align: right;" /></td>
<td class="Label">x 10</td>
<td><input id="bill_10_amt" type="text" tabindex="14"
size="9" maxlength="12" value="$0.00" class="format"
format="+ve_currency" disabled="true" style="text-align: right;" />
</td>
</tr>
<tr>
<td><input id="bill_5" type="text" tabindex="15" size="4"
maxlength="7" value="0" class="format" format="+ve_number"
onblur="Bill(this)" style="text-align: right;" /></td>
<td class="Label">x 5</td>
<td><input id="bill_5_amt" type="text" tabindex="16"
size="9" maxlength="12" value="$0.00" class="format"
format="+ve_currency" disabled="true" style="text-align: right;" />
</td>
</tr>
<tr>
<td><input id="bill_1" type="text" tabindex="17" size="4"
maxlength="7" value="0" class="format" format="+ve_number"
onblur="Bill(this)" style="text-align: right;" /></td>
<td class="Label">x 1</td>
<td><input id="bill_1_amt" type="text" tabindex="18"
size="9" maxlength="12" value="$0.00" class="format"
format="+ve_currency" disabled="true" style="text-align: right;" />
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td colspan="2" style="height: 6px"></td>
</tr>
</table>
</div>
<div class="Total" style="position: absolute; top: 280px; left: 570px;">
Total</div>
<div style="position: absolute; top: 280px; left: 620px;">
<input id="total_bills" type="text" tabindex="19" size="12"
maxlength="12" value="" onchange="onChange(this);"
onblur="TotalAmount(this);" style="text-align: right;" />
</div>
<div
style="position: absolute; top: 310px; left: 602px; height: 30px; width: 80px">
<input type="button" id="cancelButton" class="si_Button"
style="width: 60px;" tabIndex="20" onClick="Cancel()" value="Cancel" />
</div>
<div
style="position: absolute; top: 310px; left: 670px; height: 30px; width: 80px">
<input type="button" id="submitButton" class="si_Button"
style="width: 60px;" tabIndex="21" onClick="Submit()" value="Submit" />
</div>
</body>
</html>
をリセットしない限り、それはレイアウトをオフに投げることができます*ファイル(簡単にウェブ上で発見)へ各ブラウザが同じデフォルトを使用していることを確認してください。ユーザーはブラウザの環境設定でデフォルトのいくつかをパーソナライズすることができます。独自のスタイルルールでリセットしない限り、レイアウトを無効にすることがあります – charlietfl
影響を受けた部分のみを表示します。 4-10行、最適な分散のスクリーンショットが必要です。 – Gibolt