[解決済み] td widths, not working?
2022-03-06 19:17:30
質問
そこで、このようなコードを書いてみました。
<table>
<tr>
<td width="200px" valign="top">
<div class="left_menu">
<div class="menu_item">
<a href="#">Home</a>
</div>
</div>
</td>
<td width="1000px" valign="top">Content</td>
</tr>
</table>
をCSSで指定します。
.left_menu {
background: none repeat scroll 0 0 #333333;
border-radius: 5px 5px 5px 5px;
font-family: Arial,Helvetica,sans-serif;
font-size: 12px;
font-weight: bold;
padding: 5px;
}
.menu_item {
background: none repeat scroll 0 0 #CCCCCC;
border-bottom: 1px solid #999999;
border-radius: 5px 5px 5px 5px;
border-top: 1px solid #FFFFCC;
cursor: pointer;
padding: 5px;
}
私のブラウザでは問題なく動作し、MacとPCのすべてのブラウザでテストしましたが、ある人が
td
と共に
width
の200が幅を変え続けている。何を言っているのかさっぱりわかりません。の幅が変わってしまう理由をご存知の方はいらっしゃいますか?
td
?
解決方法は?
そのはずです。
<td width="200">
または
<td style="width: 200px">
ただし、セルに200pxに収まらないコンテンツがある場合(たとえば
somelongwordwithoutanyspaces
が含まれていない限り、セルは引き伸ばされます。
table-layout: fixed
をテーブルのために使用します。
EDIT
kristina childs さんの回答にもあるように、このような場合は
width
属性とインライン CSS を使用する (インライン CSS では
style
属性を使用します)。スタイルと構造をできるだけ分離するのは良い習慣です。
関連
-
[解決済み】Markdownで'target="_blank"'でリンクを作成することはできますか?
-
[解決済み】html文書に縦の空白を挿入するには?
-
[解決済み] span with onclick event inside the tag
-
[解決済み] Bootstrapのカラムが機能しない
-
[解決済み] ボディの背景色が表示されない?
-
[解決済み] bodyタグに追加された奇妙なiframe、`rufous-sandbox`について
-
[解決済み] css画像が表示されない
-
[解決済み] 文字列が部分文字列で終わっているかどうかをXPathでテストする?
-
[解決済み] ChromeのデベロッパーツールでHTML Bodyにcz-shortcut-listen="true "が表示される?
-
[解決済み] フロートされた子 div の高さを親の高さに拡張するにはどうすればよいですか?
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
[解決済み】iframeの背景色を変更する問題
-
[解決済み】スタイルシートとして解釈されるリソースがMIMEタイプtext/htmlで転送される(ウェブサーバーとは関係ないようです)。
-
[解決済み] (X)HTMLにおける "PRE "タグの用途は何ですか?
-
[解決済み] div に斜めのエッジを作成する [重複] 。
-
[解決済み] d3.tipが動作しないのはなぜですか?
-
[解決済み] will-change' や translateZ() ハックは 'transition: height' のパフォーマンスを向上させるか?
-
[解決済み] 入力のラジオ要素を水平に揃えるにはどうしたらいいですか?
-
[解決済み] Favicon.icoを表示させることができません。
-
[解決済み] Add a scrollbar to a <textarea> [duplicate]
-
[解決済み】テーブルの列幅を設定する