複数行ボタンhtml php

Question

私はh5テキストでリストボタンを作っていますが、そこにはすべて同じ幅がありますが、テキストが長ければボタン幅が広がります。より多くの行になるようにテキストが必要で、ボタンの幅を広げないでください。

for ($i=0; $i < 10; $i++) 
{ 
    echo "<button><h5>".$description."</h5></button>"; 
} 

Answer 1

@Carlヤンら@Royがボタン上widthと組み合わせるword-wrapプロパティを追加し、コメントで言ったように：

button { width: 100px; } 
 
button h5 { word-wrap: break-word; }

<button><h5>Multiline button very long text</h5></button>

Answer 2

は、クロスブラウザのテストの後にこれを試してみて、同じ幅の複数のボタン付き

button{ 
 
    
 
    display: inline-block; 
 
    max-width : 100px; 
 
    white-space: pre-wrap; 
 
     white-space: -moz-pre-wrap; 
 
     white-space: -pre-wrap; 
 
     white-space: -o-pre-wrap; 
 
     word-wrap: break-word; 
 
} 
 
h1{display:block; 
 
text-align: center; 
 
}

<button> 
 
<h1> 
 
testtesttesttest 
 
</h1> 
 
</button> 
 
<button> 
 
<h1> 
 
test1 
 
</h1> 
 
</button> 
 
<button> 
 
<h1> 
 
test2 
 
</h1> 
 
</button>

コードから基づい

Answer 3

：あなたは、各ボタンの固定幅を設定している場合

for ($i=0; $i < 10; $i++) 
{ 
    echo '<button style="word-wrap:break-word;"><h5>'.$description.'</h5></button>'; 
} 

Answer 4

、私はまた、（あなたの説明は文字の制限を持っていると仮定）分の高さを設定します、その後、

word-wrap: break-word; 

ボタンを使用すると、説明テキストが複数の行に折り返されます。