Hover Effect on Html form

Learning Challenge

HTML/CSS Assesment

Question

I was having trouble with the picture card on the form. Was hoping I could get some input on this.

What I’ve tried

I have managed to get the person picture masked and the correct size also the desert picture. I am having trouble with the formatting around the card to match the example.

Screenshots

Hi Leslie,
I’m not sure I fully understand your question, so a little more detail on the specific part you’re struggling with would be helpful.

One thing I am noticing from the screenshot is that you have placed your form inside the picture card. You can think of the form and the picture card as two separate “chunks” for this assessment, so I recommend rearranging your HTML code so it looks roughly something like this:

<form>
    ALL OF YOUR CODE FOR THE FORM IN HERE
</form>

<div class="card">
   ALL OF YOUR PICTURE CARD CODE IN HERE
</div>

Again, let me know what other questions you have - this is the detail that jumped out from the screenshot, but feel free to reply with more questions.
Jesse

Hi Jesse,

That’s very helpful I’ll give it a go and see what happens. I was struggling with the picture card in general it seemed like the css was not affecting it the way I wanted. Perhaps it’s because it’s in the form tag.

Leslie Owiti.

Character and SFX Animator.
E: o_wity@icloud.com
P: 919-949-4683
W: artstation.com/o_wity

1 Like