Assessment wanted for Images and Form elements, Task 2

MDN Learn
1

Hello, I browsed trough the similar assessment requests and I see that people approached this task differently. Now, I’m aware that several solutions are quite possible, but nevertheless, could you please take a look?

Thanks!!

.myform {
  border: 2px solid #000;
  padding: 5px;
}

#fldSearch {
	font-size: inherit;
	padding: 10px;
}


input[name="btnSubmit"] {
	font-size: inherit;
	padding: 10px;
	background-color: rebeccapurple;
	color: white;
	border-radius: 5px;
}
1 Like
2

Hi @Rastko_Gojgic

The only thing that is missing is border: 0; (We will still see the border radius because of the background color). The rest is fine.

One note about your selectors:
Using an ID selector for one and an attribute selector for the other is a bit inconsistent. In this example I would recommend using

input[type="search"] {
  ...
}

input[type="submit"] {
  ...
}

I hope that help!

Have a nice day,
Michael

PS: Please remember including a link to the task page and putting your code into an online editor for further tasks to make our lives easier. Thank you :blush:

3 Likes
3

Sorry, I forgot about that. So, the consistency is also important when choosing your selectors? I used the id because the whole structure of [type=‘something’] seemed a bit clunky too me. I used it for the last selector because I had no other options based on your HTML syntax.

Ok, thanks for your time, I will keep that in mind.
Have a nice day

2 Likes
4

See it as a developer life lesson. :slightly_smiling_face: It doesn’t matter much in this small task but:

Being consistent in all the areas of programming will help you generally. In real projects it often happens that you come back to your (or someone else’s) code after some time. If the code is consistent you’ll have a much easier time understanding it again.

BTW: The reason for the id on just one of the <input>s is the for attribute of the <label> that needs a id to be associated with its <input>.

1 Like
5

Yeah i got that. That’s why i decided to take advantage of it, since it was already there lol :grinning:

Thanks Michael for your time and advice !!

3 Likes