幅が330ピクセル、高さが50ピクセルになるインラインリストがあります。しかし、私はそれが私が望む幅/高さにすることができません。それはそれが含んでいる内容と同じくらい大きいだけですが、何が間違っていますか? http://jsfiddle.net/Apnx5/インラインリストの幅と高さを変更する
0
A
答えて
3
現在のhtml設定では、これを行うことはできません。私はこれらのリストアイテムをコンテンツに基づいて動的にサイズ調整したいと思っていますが、残っているものがあればそれを追加してください。
代わりにdisplay: table-cell
を使用してください。これには、マークアップとCSSの両方の変更が必要です。 IE7との互換性はありませんが、IE7は急速に死んでいます(IE6とは異なります)。
http://jsfiddle.net/mrtsherman/Apnx5/6/
<div id="listed">
<div class="item"><a href="#"> Profile </a></div>
<div class="item"><a href="#"> About </a></div>
<div class="item"><a href="#"> Photos </a></div>
<div class="item"><a href="#"> My Albumlist </a></div>
</div>
#listed {
height: 50px;
width: 330px;
display: table;
}
div.item {
display: table-cell;
border: 1px solid gray;
vertical-align: middle;
text-align: center;
border-collapse: collapse;
}
+0
HTMLの変更が必要なのはなぜですか? ulとli要素はそれらのスタイルをとることができるはずです。 –
+0
答えは正しいですが、恐ろしいです。私はここでそれを修正した:http://jsfiddle.net/Apnx5/13/ – caleb
関連する問題
- 1. SWFの幅/高さを変更する
- 2. 変更MagnifierGlassの高さと幅
- 3. 幅や高さを変更するときのUIImageViewの幅:高さの比率を保持する方法
- 4. 散布図のマーカーの幅と高さを変更する
- 5. as3のswfの高さと幅を変更する問題?
- 6. ブートストラップのモーダルの幅と高さを変更する
- 7. Androidのボタンの幅と高さを変更する方法
- 8. プログラムでテキストビューの高さと幅を変更する
- 9. jquerymobile ui-blocksの高さと幅を変更するには
- 10. ヘッダーの固定高さと幅を変更する(HTMLテーブル)
- 11. Html - スライダの幅と高さを変更する
- 12. jQueryスライダの幅と高さを変更する
- 13. イメージの高さと幅を変更する - アンドロイド
- 14. ディスアセンブラでウィンドウの幅と高さを変更する
- 15. 画像の高さと幅を変更する
- 16. ng2-chartsの幅と高さを変更する
- 17. Android:向き変更の幅と高さを交換する
- 18. ウィンドウの幅/高さを変更するときのdivの自動サイズ変更
- 19. 寸法、幅/高さの変更のみ
- 20. JavaScriptを使用して幅と高さを変更する
- 21. 自動変更イメージの幅/高さ
- 22. レベリングで幅と高さを動的に変更する方法
- 23. 高さと幅を変更する方法QTabWidgetタブ
- 24. 列の幅と行の高さを変更します
- 25. CGAffineTransformMakeRotationはUIViewの高さと幅を変更します
- 26. divsの幅と高さをdinamicallyに変更します
- 27. SearchBarとTextFieldの高さと幅の変更
- 28. 幅と高さの画像の切り抜きとサイズ変更
- 29. コーデックミラーのTextAreaの高さと幅を変更
- 30. ggplotlyで幅と高さを変更するには?幅と高さを変更する簡単な方法はありますか?
あなたがすることを指定したとおりに働いています。指定したとおり、リストの幅は330px、リストの高さは50pxです。すべてのアイテムが330px x 50pxになるようにすることを意味しましたか? – caleb
あなたのリスト項目は 'ul'を埋めるものではありません。余分なスペースがどこで終わると思いますか? 4つのアイテムに均等に分散していますか? – mrtsherman
@mrtshermanはい、それは可能ですか? – user1174762