HTML/CSS のどんな質問にも優しく答えるスレ 52 (881レス)
HTML/CSS のどんな質問にも優しく答えるスレ 52 http://mevius.5ch.net/test/read.cgi/hp/1692784333/
上
下
前
次
1-
新
通常表示
512バイト分割
レス栞
128: Name_Not_Found [sage] 2023/09/12(火) 14:47:08.43 ID:??? 自分は2 http://mevius.5ch.net/test/read.cgi/hp/1692784333/128
129: Name_Not_Found [sage] 2023/09/12(火) 14:52:45.66 ID:??? 個人的には2だが逆の人いるんだよな orかandかのラジオボタンも作っちゃえば http://mevius.5ch.net/test/read.cgi/hp/1692784333/129
130: Name_Not_Found [sage] 2023/09/12(火) 17:22:16.78 ID:??? >>127 俺も 2 http://mevius.5ch.net/test/read.cgi/hp/1692784333/130
131: Name_Not_Found [sage] 2023/09/12(火) 19:02:35.63 ID:??? 自分は1 hiddenにしていくなら1が自然だと思う 絞り込み検索って書いておいてくれるとなお嬉しい感じ 2の挙動は初期状態が表示件数ゼロで項目を足していく時に使うのが自然に感じる http://mevius.5ch.net/test/read.cgi/hp/1692784333/131
132: Name_Not_Found [] 2023/09/14(木) 13:06:02.38 ID:aPP30ZSe tableの作り方で質問です。 こんなテーブルを作ろうと思っています。 a: colspan=2 b: colspan=2 c: colspan=4 d: 指定不要 e: colspan=2 f: 指定不要 とすればよいと思うのですが、 テーブル全体の幅やeとfの中身のテキスト量にかかわらず eとfの幅が均等な状態を維持したいです。 その場合、どのように設定すればよいでしょうか。 必要な情報かわからないですが以下補足です。 aとdのwidthは固定、 bはテーブル全体の幅からaの幅を引いた幅 cは未固定(テーブル全体の幅) eとfはテーブル全体の幅からdの幅を引いた幅を2分した大きさとなるようにしたいです。 sssp://o.5ch.net/21xso.png http://mevius.5ch.net/test/read.cgi/hp/1692784333/132
133: Name_Not_Found [sage] 2023/09/14(木) 13:48:54.86 ID:??? dが固定ならefはcalc使えばよさそうだけど tableだとダメとかあるんかな http://mevius.5ch.net/test/read.cgi/hp/1692784333/133
134: Name_Not_Found [sage] 2023/09/14(木) 14:04:55.94 ID:??? >>132 <col>を用意してそれにwidthを指定したらよいのでは http://mevius.5ch.net/test/read.cgi/hp/1692784333/134
135: 132 [sage] 2023/09/14(木) 15:05:02.01 ID:??? colタグの存在を初めて知りました。 calcを用いた指定と合わせて試してみたのですが、やり方や考え方が間違っているんでしょうか… https://codepen.io/Nickey-the-looper/pen/MWZoPJv http://mevius.5ch.net/test/read.cgi/hp/1692784333/135
136: Name_Not_Found [sage] 2023/09/14(木) 16:40:54.34 ID:??? grid使うとか他にもっと良い方法があるのかもしれないけど、とりあえずtable使うということで ・tableの最上段にダミーでtr1行追加 ・更にbと同一幅のセルを左から4番目に追加 ・最上段だけvisibility: collapse;で不可視化(hiddenだとレイアウトからも除去されるので) ってのはどうでしょう? https://jsfiddle.net/dumov8ng/ http://mevius.5ch.net/test/read.cgi/hp/1692784333/136
137: Name_Not_Found [sage] 2023/09/15(金) 01:14:20.28 ID:??? Bootstrap で出来ないの? http://mevius.5ch.net/test/read.cgi/hp/1692784333/137
138: Name_Not_Found [] 2023/09/15(金) 04:02:19.83 ID:9yhdlK5+ 列数を増やしてしまえ http://mevius.5ch.net/test/read.cgi/hp/1692784333/138
139: Name_Not_Found [sage] 2023/09/15(金) 04:07:26.56 ID:??? あとは行にtable追加するとか 昔はよくやってたけど今はもっと便利な方法があるのかな http://mevius.5ch.net/test/read.cgi/hp/1692784333/139
140: Name_Not_Found [sage] 2023/09/15(金) 04:58:56.21 ID:??? みんな>>132の説明でどんなテーブルかわかるん? 俺全然わかんねえや… http://mevius.5ch.net/test/read.cgi/hp/1692784333/140
141: Name_Not_Found [sage] 2023/09/15(金) 08:31:34.98 ID:??? 一番下のお絵かきの画像 http://mevius.5ch.net/test/read.cgi/hp/1692784333/141
142: 132 [sage] 2023/09/15(金) 16:21:00.96 ID:??? >>136さんと138さんの方法で出来ました! 大変助かりました、ありがとうのざいます。 gridはよくわからなかったので勉強してみます。 >>137 まさにbootstrap使ってるんですが、gridレイアウトを使ったらどうかということでしたかね? http://mevius.5ch.net/test/read.cgi/hp/1692784333/142
143: Name_Not_Found [sage] 2023/09/15(金) 16:24:10.05 ID:??? なぜgridはflexに負けたのですか? http://mevius.5ch.net/test/read.cgi/hp/1692784333/143
144: Name_Not_Found [sage] 2023/09/15(金) 17:02:01.69 ID:??? >>141 あー、分かる人にはなんか表示されてるのか 納得 http://mevius.5ch.net/test/read.cgi/hp/1692784333/144
145: Name_Not_Found [sage] 2023/09/15(金) 17:06:03.89 ID:??? >>143 別に勝ち負けないじゃん? flexの出始めと一緒で、使えるようになった人から使っていく流れっしょ http://mevius.5ch.net/test/read.cgi/hp/1692784333/145
146: Name_Not_Found [sage] 2023/09/15(金) 17:33:04.16 ID:??? というか今でもflex使うけど 単に横一列縦一列に並べるなら絶対flexのが早いし http://mevius.5ch.net/test/read.cgi/hp/1692784333/146
147: Name_Not_Found [sage] 2023/09/15(金) 18:45:00.12 ID:??? >>142 >>135のcodepen見て>>136作ったけど、>>132の画像ちゃんと見てなかったから一応修正 https://jsfiddle.net/xjo2qLcy/ 結局のところtable-layout: fixedの場合は table-layout - CSS: カスケーディングスタイルシート | MDN https://developer.mozilla.org/ja/docs/Web/CSS/table-layout#%E5%80%A4 > 表と列の幅は table 要素と col 要素の幅によって、または最初の行のセルの幅によって設定されます。後続する行のセルは列の幅に影響しません。 ってことなので、先頭行がcolspanで結合してる場合には後続のセル幅のコントロールが少し面倒 colタグ使ってもセルが結合してると難しいね あとはダミー追加したくなかったら、あまり推奨はされてないけどtableの中にtableをネストしてもイケる https://jsfiddle.net/q48phobx/ http://mevius.5ch.net/test/read.cgi/hp/1692784333/147
上
下
前
次
1-
新
書
関
写
板
覧
索
設
栞
歴
あと 734 レスあります
スレ情報
赤レス抽出
画像レス抽出
歴の未読スレ
AAサムネイル
Google検索
Wikipedia
ぬこの手
ぬこTOP
0.009s