Build a Product Landing Page - Tests not recognising code

1

Tell us what’s happening:
Two of the Tests aren’t passing - even though they should:

Content:
11. Within the form, there is a submit <input> with corresponding id=“submit”.
I have used the code:

<button id="submit" type="submit">Submit</button>

Layout:
2. My product landing page should have at least one media query.
However, I have two so far:

	@media(max-width: 600px) {
		position: relative;
		width: 100%;
	}

Can someone help please? What am I doing wrong - or is this a bug?

Thanks!
Claire

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/73.0.3683.86 Safari/537.36.

2

Could you link to your codepen page?

Regarding the first issue, it looks like you used a <button> element, but the challenge is asking for an <input> element.

3

ahh, thank you! I will change the button element!

I’m not able to add a link as I have a new account… will try again.

4

Hey, for the media query try to write it like this and see if it helps :slight_smile:

@media only screen and (max-width: 600px)

5

Hi Rokimedes, I have tried that and no joy!

I also ‘unnested’ it from the header and it still doesn’t recognise it.

@media only screen and (max-width: 600px) {
    flex-wrap: wrap;
}

#header-img {
	width: 300px;
	
	@media(max-width: 600px) {
		background-color: yellow;
	}
}
6

I changed the button to input and that works now :slight_smile: Thank you!

so it’s just the media query that’s not being recognised.

7

Wish I could see you’r code, would have been muich easier :slight_smile:

But do you remember to close your media queries?

example:

@media screen and (max-width: 600px) {
    
    #exhibition-box {
        width: 70%;
        height: 40%;
    }
}

might be missing a closing } somewhere?

8

Ahh! Maybe?

I changed it to this and it’s recognised now:

@media only screen and (max-width: 600px) {
	
	#header {
    background-color: blue;
	}	
}

so I think it might have been a mix of me doing it wrong + not closing them properly… :slight_smile:

Thank you so much for taking the time to respond and help me, I really appreciate it!

9

Aaah…

Yeah you have to target a #id or .class or tag inside your media query for it to work!

But good that you got it to work now :slight_smile:

10

I definitely missed that I needed to do that. thank you very much! :slight_smile:

Now just to finish styling my page so it looks less like trash… :slight_smile:

11

Haha yeah!

Happy coding! :slight_smile: