CSS グリッドの学習: 雑誌を作成する - ステップ 77

状況を説明しましょう:

only screen and (max-width: 720px) を対象とする新しい @media ルールを作りましたが、エラーと言われます。過去の質問を見つけましたが、私の場合には当てはまりません。どこを直せばいいでしょう?

現状のコード

<!-- file: index.html -->

/* file: styles.css */
/* User Editable Region */

@media only screen and(max-width:720px){
  .image-wrapper{
    grid-template-column: 1fr;
  }
}

/* User Editable Region */

ブラウザ情報:

ユーザーエージェント: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:134.0) Gecko/20100101 Firefox/134.0

チャレンジの情報:

CSS グリッドの学習: 雑誌を作成する - ステップ 77

Hi @mvvvm8qq,

this part is wrong, it should be grid-template-columns. :smiling_face_with_three_hearts:

Japanese translation:
こんにちは @mvvvm8qq さん

この部分は間違っています。「grid-template-columns」である必要があります。:smiling_face_with_three_hearts:

ありがとうございます。早速そこを治しましたが、エラーメッセージは同じで、” only screen and (max-width: 720px) を対象とする新しい @media ルールが必要です。”と言われます。

今@mediaルールの間違いがわかりました。
@media only screen and (max-width:720px)の、
and(max…)のところ、dと(のあいだにスペースを入れたら解決しました!
回答してくださった方、読んでくださった方、ありがとうございました。

2 Likes