1

次のHTMLコードがあります。http://jsfiddle.net/Lijo/wJX9C/

コンテンツ（「HAI」とボタン）を中央揃えにする必要があります。どうすれば修正できますか？

注：IE7、Chromeで動作する必要があります

<html>
<div id="popup"  class="popup">
       <div id = "poupContentLine1" class="poupContentLine">
            HAI
       </div>
       <div id = "poupContentLine2" class="poupContentLine">
            <input type="submit" name="ctl00$detailContentPlaceholder$btnClose" value="CLOSE" id="detailContentPlaceholder_btnClose" />
       </div>
</div>
</html>

スタイル

.popup 
{
  width:530px;
  background-color:#ffffff;
  border:3px solid Orange;
  padding: 10px 5px 10px 5px;
  margin: 0px 0px 0px 0px;
}

poupContentLine
{
    width:530px; 
    height:auto;
    text-align:center;
    margin: 0px 0px 0px 0px;
}
4

2 に答える 2

10

あなたは逃した.

.poupContentLine

それはクラス名なので — フィドルの例: http://jsfiddle.net/wJX9C/2/

于 2012-05-30T11:57:08.243 に答える
1

まず、popupcontentlineスタイリングを削除します。それは不要です。次に に追加text-align: centerし.popupます。また、短くしてmargin: 0;ください（問題とは関係ありませんが、これらの「0」はすべて必要ではなく、コードが長くなります。）

例: http://jsfiddle.net/wJX9C/10/

.popup
{
    width:530px;
    background-color:#ffffff;
    border:3px solid Orange;
    padding: 10px 5px 10px 5px;
    margin: 0;
    text-align:center;
}

注: HTML も単純化できますが、私は何もしていません。

于 2012-05-30T12:01:41.837 に答える