css - divのサイズを固定するにはどうすればよいですか？

Question

私はサイトを作成したので、30pxボタンをクリックすると、内のフォントが変更されますdiv。

中にulはボットンが入っています。フォントのサイズを変更すると、div展開され、ナビゲーションボタンも一緒に移動します。

修正されたままで、フォントが変更される可能性があるようにするにはどうすればよいですか。

Answer 1

次の css を試してください。

#innerbox
{
   width:250px; /* or whatever width you want. */
   max-width:250px; /* or whatever width you want. */
   display: inline-block;
}

これにより、div のスペースができるだけ少なくなり、その幅は css によって定義されます。

// 展開された答え

ボタンを固定幅にするには、次の手順を実行します。

#innerbox input
{
   width:150px; /* or whatever width you want. */
   max-width:150px; /* or whatever width you want. */
}

ただし、テキストのサイズが変わると、表示に必要なスペースも変わることに注意してください。そのため、コンテナーを拡張する必要があるのは当然です。おそらく、何をしようとしているのかを確認する必要があります。コンテンツの配置が完璧になるように、javascript を使用してオンザフライで変更する定義済みのクラスをいくつか用意することもできます。

Answer 2

.css で max-height と max-width を指定できます

.fontpixel{max-width:200px; max-height:200px;}

高さと幅のプロパティに加えて

Answer 3

それがボタンの自然な動作です。親コンテナーに max-width/max-height を設定することもできますが、それでうまくいくかどうかはわかりません。

max-width:something px;
max-height:something px;

もう 1 つのオプションは、devlopr ツールを使用して、自然なパディングを削除できるかどうかを確認することです。

padding: 0;

Answer 4

このスタイルを使用

<div class="form-control"
     style="height:100px;
     width:55%;
     overflow:hidden;
     cursor:pointer">
</div>