3

この機能をオフにする方法はありますか? 通常の HTML タグとは異なり、のコンテンツ<button>は常に垂直方向の中央揃えになります。

デモ: http://jsfiddle.net/HbqnR/

ボタンの左上隅にテキストを表示して、の<button>ように動作したい。<a>

WebKit 固有の修正を探してい-webkit-*ます。この動作を制御する css プロパティがあるかもしれません。ハッキングは大歓迎ですが、追加のマークアップは使用しません。

前もって感謝します ：）

.button
{
    display:inline-block;
    height:200px;
    border:4px gainsboro outset;
    background:silver;
    vertical-align:middle;
    padding:20px;
    box-sizing:border-box;
    text-decoration:none;
    width:200px;
    text-align:left;
}

<button class="button">&lt;button&gt;</button>
<a href="http://www.google.com" class="button">&lt;a&gt;</a>
4

5 に答える 5

0

追加のマークアップを要求しなかったようですが、そのルートをたどると決めた場合、1 つの簡単なアイデアは、配置と 1 つの追加要素を使用することです。

button {
  position: relative;
}

button > span {
  position: absolute;
  top: 0;
}

<button><span>&lt;button&gt;</span></button>
于 2013-10-24T03:47:15.023 に答える
-1

これをチェックしてください：P JSFIDDLE DEMO

   .button
{
    display:block;
    height:200px;
    border:4px gainsboro outset;
    background:silver;
    vertical-align:top;
    padding:20px;
    box-sizing:border-box;
    width:200px;
    text-align:left;
    text-indent: 0;
    white-space: normal;
    word-spacing: 0px;
    letter-spacing: 0px;
    float: left;
    top:0;
}

それはうまくいくかもしれません。ボタンが何のために必要なのかよくわかりません。しかし、これはあなたが以前に求めていたものと同じように見えます。こちらを利用しました。

<title>Documento sin título</title>
<body>
<form id="form1" name="form1" method="post" action="">
  <button class="button">tODAY WE ARE HERE WONDERING WHAT TO DO<p>&nbsp;</p><p>&nbsp;</p><p>&nbsp;</p><p>&nbsp;</p><p>&nbsp;</p><p>&nbsp;</p><p>&nbsp;</p></button>
</form>
</body>
于 2013-10-24T04:06:33.600 に答える