HTML/CSS のどんな質問にも優しく答えるｽﾚ 52 (850ﾚｽ)
上下前次1-新
1(1): 2023/08/23(水)18:52 ID:??? AAS
ここは初心者からベテランまで、全ての人を対象に優しく答えるスレです
類似質問、重複質問、丸投げ大いに結構。HTML / CSS 関係の事なら何でもOK
分からない人は何回聞いても結構。
質問するときはIDを出すためにメール欄を age にすることをおすすめします。
回答してくれる方は優しい人のみ！ 質問者に対して暴言を吐く人はこのスレを見るな！！
終わった話を蒸し返すやつは このスレにくるな！！！
自分で調べろという回答も禁止！！回答するかさもなくば何も書き込むな！！
質問側も節度あるレスで！質問前にスレ内を検索しましょう
■次スレについて
基本的にレスナンバー>>980を取った人（立てられない場合は次の宣言者）が立てて下さい
省14
2: 2023/08/23(水)21:00 ID:??? AAS
>>前998
新スレ立てた瞬間に知り合いが遊びに来てレスするの忘れてスレ埋まってしまいました。
また相談に乗ってもらったらありがたいです
3(3): 2023/08/24(木)09:43 ID:??? AAS
質問失礼します。
レスポンシブデザインでサイトを作成しており、PCから見た時に①の画像のようになるようにCSSを書きました。
これがスマホから見ると②の画像のようになってしまいます。
PC表示部分のCSSは③の画像、スマホ表示部分のCSSは④のような状態なのですが、どこを改善すればよいでしょうか。
画像ﾘﾝｸ[png]:i.imgur.com
画像ﾘﾝｸ[png]:i.imgur.com
画像ﾘﾝｸ[png]:i.imgur.com
画像ﾘﾝｸ[png]:i.imgur.com
4(1): 2023/08/24(木)09:50 ID:??? AAS
>>3
②が正しくないのでしたら、まずどうなるのが正しいのかを書きましょう
5(2): 2023/08/24(木)11:06 ID:??? AAS
>>3
画像のinline-block上の階層でflex使いなよ
横に並べるにしても縦に並べるにしても制御が楽になるよ
6: 2023/08/24(木)11:07 ID:??? AAS
>>5
あ、編集したら抜けた
画像のinline-block「やめて」上の階層で
7: 2023/08/24(木)11:08 ID:??? AAS
>>4
失礼しました
テキストがスマホの端で折り返し、ピンクの点線枠内に収まるようにしたいです
8(2): 2023/08/24(木)11:09 ID:??? AAS
>>3
#mainあたりにmax-width入れてみては？
9: 2023/08/24(木)11:09 ID:??? AAS
>>5
レスありがとうございます
flex調べてみます
10: 2023/08/24(木)11:10 ID:??? AAS
>>8
③のCSSの#main内でよろしいですかね
やってみます
11: 2023/08/24(木)11:33 ID:??? AAS
>>8さんのやり方でできました！
しかし制御が楽になるとのことなので、この機会にflexのことも勉強しようと思います
また何かありましたらこのスレで質問させてください
アドバイスありがとうございました
12(1): 2023/08/24(木)17:47 ID:??? AAS
疑似要素を4つ使いたい場合、タグを増やすしかない？
でもそれって明らかに論理マークアップ上で無駄なHTMLだよね
13(1): 2023/08/24(木)19:11 ID:??? AAS
それをいうなら疑似要素が4つ必要になるのはデザインに対してマークアップがおかしいです
14: 2023/08/24(木)20:20 ID:??? AAS
正論ですな
15(2): 2023/08/24(木)22:20 ID:??? AAS
>>13 例えば
見出しタイプ1
====================================
↑これが通常の見出しで一箇所だけ↓こうなる場合
☆ ★ ※星部分が回転
見出しタイプ2
★ ☆
divで親タグを増やしていくって方法以外無いでしょう？
デザインの為だけに無駄なＨＴＭＬが増えるんでしょ？
省3
16: 2023/08/24(木)22:21 ID:??? AAS
↑閉じタグ抜けてるがきにせんといて
上下前次1-新書関写板覧索設栞歴
あと 834 ﾚｽあります
ｽﾚ情報 赤ﾚｽ抽出 画像ﾚｽ抽出 歴の未読ｽﾚ AAｻﾑﾈｲﾙ
ぬこの手 ぬこTOP 0.007s