0
jqueryを使用して動的にロードされるテーブルがあります。私は中央にパラメータを配置しています。しかし、それは左に整列した。助けてください、私はそれだけで正常に動作することをtable.Removeでwidth:100%;によるものであるアライメントパラメータを使用してテーブルを中央に配置できません
<title></title>
<style>
.tb1 { background-color : #EEE8AA; color: black; font-size: 13pt; onfocus="this.value=" font:verdana}
.inp { border: 0; color: black; font-size: 13pt; onfocus="this.value=" font:verdana }
/* button styles */
.button0 { background-color: Orange ; border: 110; color: black; text-align: center; text-decoration: none; display: inline-block; border-color: #ff0000; }
.button1 { background-color: Orange ; border: 110; color: black; text-align: center; text-decoration: none; margin: 0 auto; display: block; border-color: black;}
.button2 { background-color: Orange ; border: 110; color: black; text-align: center; text-decoration: none; margin: 0 auto; display: block; border-color: black;}
/* web page layout styles */
html, body { margin: 0;}
div { height: 30%; background-color: white; float: left;}
#left { width:33%; margin-top:20px }
#center { width:33%; margin-top:20px }
#right { width:33%; margin-top:20px }
/* table-itemtable styles */
table { border-collapse: collapse;}
th, td { text-align: center; padding: 8px;}
th {background-color: #4CAF50; color: white;}
tr {border-bottom: 1px solid;}
tbody { display: block; }
tbody {
height: 300px; /* Just for the demo */
overflow-y: auto; /* Trigger vertical scroll */
overflow-x: hidden; /* Hide the horizontal scroll */
}
</style>
</head>
<body>
<div id="left">
GRn: <input type="text" id="grn" class="tb1" placeholder="Provide your input" onkeypress="return isNumber(event)" autofocus="autofocus" /><br><br>
Unit: <input type="text" list="combo-options" id="unit" class="tb1">
\t \t <datalist id="combo-options">
\t <option value="UNIT 1">UNIT 1</option>
\t \t <option value="UNIT 2">UNIT 2</option>
\t \t </datalist><br><br>
<input type="button" id="find" value="Find" class="button0"/><br><br>
</div>
<div id="center">
PO no: <input type="text" id="pono" readonly="readonly" class="inp"/><br><br>
PO Date: <input type="text" id="podt" readonly="readonly" class="inp"/><br><br>
V.Inv.No <input type="text" name="vinvno" readonly="readonly" id="vinvno" class="inp"/><br><br>
V.Inv.Date <input type="text" name="vinvdt" readonly="readonly" id="vinvdt" class="inp"/><br><br>
</div>
<div id="right">
IRno: <input type="text" name="irepno" id="irepno" class="inp" /><br><br>
Creation Date <input type="date" name="cdate" id="cdate" class="inp" value="<%= new SimpleDateFormat("dd-MM-yyyy").format(new java.util.Date())%>"><br><br>
Type<select name="evalu" id="evalu">
\t <option value="electrical">Electrical</option>
\t <option value="mechanical">Mechanical</option>
</select>
</div>
<div id="tablediv">
<table cellspacing="0" id="itemtable" align="center">
<tr>
\t <th> SLno</th>
<th>Item name</th>
<th>Item code</th>
<th>Supplier</th>
<th>Received qty</th>
<th>Accepted qty</th>
<th>Rejected qty</th>
<th>Remarks</th>
</tr>
</table>
</div>
<div id="inspdiv">
</div>
</body>
</html>
</html>
[テーブルヘッダーの整列テキスト（http://stackoverflow.com/questions/13992096/align-text-in-a-table-header） –