Learn CSS Grid by Building a Magazine - Step 1

HTML-CSS
1

Tell us what’s happening:
Describe your issue in detail here.

Your code so far

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

<!-- User Editable Region -->

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset=UTF-8>
    <meta name="viewport" content="width=device-width, 
          initial-scale=1.0"/>
   
  </head>
  <body>
  </body>

</html>

<!-- User Editable Region -->


/* file: styles.css */

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:109.0) Gecko/20100101 Firefox/117.0

Challenge: Learn CSS Grid by Building a Magazine - Step 1

Link to the challenge:

2

Hello! If you look at your
meta name=“viewport” (etc etc)
and
meta charset=UTF-8,
you’ll see where the issue is. It has to do with “” :slight_smile:

3 
<!DOCTYPE  html>
  <html lang="en">
  <head>
    <meta charset=UTF-8>
    <meta name="viewport" content="width=device-width, 
          initial-scale=1.0"/>

  </head>
  <body>
  </body>

</html>

This is what I consider proper boilerplate except I would include a pair of tags . I submitted this to the first lesson in Learn CSS by Building a Magazine and got an error saying that I have to have 2 meta tags. Well, I think I see 2 meta tags; so that can’t possibly be the problem. These error messages are less than useful sometimes (dare i say ‘often’?), I have no doubt that I made an error, but if the message relates to it the relationship is arcane.

I really would like to know what is considered good boilerplate to start a project because I waste hours trying to get inside the head of whomever wrote the error message. Read/Search./Ask? Yes I did! Every reference I found including an HTML validator showed the same meta tags. I put them in 2 tags because that’s what one of the error messages said: that it wants 2 meta tags.

I will create boilerplate, store it in GIT and drag it out when I start a project if it will keep me from wasting so much time trying to outguess the lesson.

PS: the "" didn't work in this post either. The actual post here the I see in my screen includes "

4

I commented on your other post, but the issue for this lesson is with the actual code, not the boilerplate. :slight_smile:

5

Clearly! But the error doesn’t come close to telling me what’s wrong. I’ll resort to more screenshots, but it seems that the real issue is the messages returned that help not at all!f

Could you provide me a link to the other post you responded to? If I posted twice it was in error.

6

It really, really helps if you use the Ask For Help button so your code is formatted for you and a link to the Step is provided.

7

I just looked at the other post you made so I didn’t catch the declaration at the top here. Also, try checking the placement of “initial-scale=1.0” />. When I ran the code, I had to back it up so that it wasn’t on a separate line because there was too much space between it and “width=device-width”. That in combination with the added in “” that I mentioned on the previous post passed through to the next step so hopefully that all works for you! If not, as others have probably mentioned before, disabling dark-mode, hard refresh, and changing browsers can help!

*Edited to add: it’s all here now! Thanks @JeremyLT !

8

I suspect this is a problem. The instructions didn’t have a bunch of whitespace in the middle of the specified value.

9

I’m gonna sleep on this tonight and see if I have a clearer head in the morning.

When my boilerplate was flagged in error, I asked here what constituted acceptable boilerplate for a project, thinking that I would create a file that I could just paste in here to start a lesson segment; BUT NOooooooooo! The powers that be don’t allow cutting and pasting.

If I can’t make more progress tomorrow, I’m going to cancel my monthly stipend and find a more reasonable set of computer-assisted-instruction lessons . . . lessons that will actually id what the problem is instead of hinting at it and where I can cut and paste. Not having that functionality cripples this set of lessons, IMO.

As CIO I contracted to have a lot of it computer-assissted-instruction modules written which forced me to learn a good deal about concepts of good design. We actually tested with users and incorporated good ideas into our modules. I don’t even see a feedback mechanism here except to complain on the forum. I’m sure I’m stepping on someone’s toes, but if your toes can’t take it you shouldn’t have them stuck out where they trip folks. IMO.

G-nite!

11

We are more more than happy to help you fix your code if you show us what you tried and what the current error message is.

Unfortunately, it’s impossible to guess every single possible user error since there are an infinite number of possible errors, so the tests any cover the most common errors. The forums are here to help cover the rest of the cases.

There is a way to flag issues on our GitHub, but the expectation is that you have attempted to get help on the forum first.

12

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.