HTML/CSS Button and 600px Mistakes

Learning Challenge

HTML/CSS

Question

What have I done wrong regarding the buttons, input, and 600px requirements?

What I’ve tried

I think my problem with the buttons, is that I used an input type instead of button element. I fixed that in the 5th Screen shot. Please, let me know if there is still a mistake.

Regarding the 600 max width problem, I think even though the grid display forced 600px width my problem was that the form element itself was larger. In other words, the column width was 600px, but the entire element was greater than 600px. I think I fixed that in my last two screen shots, with the 3rd from last being what displays now in the (hopefully) correct display.

Screenshots

For clarity, the first 4 are original (incorrect) and the second 4 are fixed (maybe!!). I hope that this is clear!! Thank you so much for the help.

Oops!

Here were the points I missed:

The questions you missed were:

* has a ‘button’ element which contains the exact text “Create new pet”

  • has two ‘input’ fields

  • has a ‘form’ element that is 600px when the window is wider than 600px

  • has exactly one reset ‘button’ elements that has the content ‘Reset’

Hi Simzee,

Looks like you’re on the right track in recognizing the button/input problem - that issue did probably cause 3 of the 4 failed tests.

As for the 600px specification…
Again, you’re thinking is on the right track. The tests are specifically looking at how you are controlling the width of your form element, so changing your css to target the form width specifically is the correct approach. Since this is an assessment, I can’t really tell you whether it is correct or not, but I would just recommend testing it out in the browser, making the screen width narrower and wider, and confirm that the form is behaving correctly at both widths.

Let us know how it goes!
Jesse

Passed!!! Thank you!!! Just have the boolean left. And, it seems super complicated so far, haha. :slight_smile:

1 Like