1

テーブルと div を使用して中央揃えのボタン グループを作成していますが、何らかの理由でボタンの配置がおかしくなりますか? これが問題のjsfiddleです。ジャスフィドル

これを修正して、ボタンを追加してまっすぐにする方法はありますか? さらにコードが必要な場合は、私に尋ねてください。投稿します。

これが私のhtmlです：

 <div align = "center" class="bdy">

        <table class="wrapper">

            <tr>

                <td>

                    <button type="button">Services</button>

                    <br>

                    <button type="button">Live</button>

                </td>


            </tr>

        </table>

    </div>​

私のCSSはフィドルにあります！

4

4 に答える 4

2

ボタンの間を取り除くと、<br>それが修正されました。

于 2012-09-08T03:49:48.157 に答える
2

ボタン間の空白を削除して配置を修正しましたが、これは正しい方法ではありません。

修正版（参考のみ）：http: //jsfiddle.net/J7rYF/1/

ボタンのレイアウトに表を使用しないでください。div align=center廃止されました。<br>このタイプの書式設定には使用しないでください。

すぐに使用できる例/ソリューションが必要な場合は、Twitter Bootstrapに非常に優れた例とテンプレートがいくつかあります。

または、ボタンのリストを中央に配置するために開始できる簡単なテンプレートを次に示します: http://jsfiddle.net/J7rYF/10/

HTML

<div class="button-set">
    <ul>
        <li><button type="button">Services</button></li>
        <li><button type="button">Live</button></li>
    </ul>
</div>

CSS

.button-set {
   width: 300px;
   margin: 0 auto; /* this centers the element */       
}

.button-set UL {
    list-style: none; /* removes bullets */  
}

/* this controls spacing between adjacent buttons */
.button-set LI + LI {   
    margin-top: 4px;
}

/* width: 100% is needed...everything else is optional */
BUTTON {
    width: 100%;
    border: 1px solid #000;
    padding: 4px;
    border-radius: 4px;
    color: #fff;
    background-color: #006DCC;
}

</p>

于 2012-09-08T03:49:55.023 に答える
0

あなたmargin:0;はボタンCSSで与え、.button-set ul li{margin:0}

于 2012-12-27T11:09:50.237 に答える
-1

そのtd内に別のテーブルを追加し、新しいテーブル内にこれら2つのボタンを置くことができます

于 2012-09-08T14:46:30.200 に答える