+ 1

Good and Bad practice? (Web Dev)

In css, when referencing what I wanna style like h2, p, etc. is it good practice to always say the parent? like if my paragraph is nested inside of h1, should i always do h1 p { (style blablabla) } just for good practice? or can i just do p { (style bllabala) } also is it good practice to id most things like h2, p, buttons, etc? (by the way i know i can do whatever but by “can i just do” i mean is it still ok practice, im basically asking if something is better practice to do

20th Aug 2024, 1:29 AM
rblx _pro
rblx _pro - avatar
6 Answers
+ 1
rblx _pro Yes if it is necessary. No if it is not needed . it might even become counter productive by being too specific.
21st Aug 2024, 12:06 AM
Bob_Li
Bob_Li - avatar
+ 3
No, <h1> is a heading, The <p> element is not allowed as a child of the <h1> element. It doesn't validate. You might want to use the <header> tag to group content, in which case header p {} would be valid.
20th Aug 2024, 3:14 AM
Chris Coder
Chris Coder - avatar
+ 2
"In css, when referencing what I wanna style like h2, p, etc. is it good practice to always say the parent? like if my paragraph is nested inside of h1, should i always do h1 p { .... } just for good practice? or can i just do p { .... }" Not exactly about good practice, I guess it is more closely related with precisely targeting the thing you wanted to style. There are several combinators in CSS, and each may be used for targeting specific elements based on hierarchy etc. This one, targets any <p> elements, disregarding whether they have parent or not. p { .... } This one, targets any <p> elements which is a descendant of a <div>. Hence the term - "Descendant combinator". Descendant is not the same with immediate child, a descendant may be a child, a grand child, great grand child and so forth. div p { .... } I think it's better for you to read the following page where you can find extended details about CSS combinators. It would obviously provide better view than any of my attempt to explain. https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_selectors "Also is it good practice to id most things like h2, p, buttons, etc?" Set ID of an element when you want to: 1. Define CSS rules (stylings) for that particular element. Remember ID is supposedly assigned to a single element. Having multiple elements sharing similar ID leads to confusion, and goes against the purpose of element's ID (supposedly unique - just for a particular element) 2. Refer that particular element in a script, for whatever reason you find necessary. Good topic for discussion, first one for today Thanks, may any learner viewing this post also learn and share :)
20th Aug 2024, 4:11 AM
Ipang
+ 1
Bob_li ok thank you very much
21st Aug 2024, 1:58 AM
rblx _pro
rblx _pro - avatar
0
Adding the parent is for more specificity. If you only want the style to affect a specific tag in a particular section, but not others. You don't need it for styles applied globally. using clases rather than id is what I usually prefer. I use id mostly for js.
20th Aug 2024, 8:12 AM
Bob_Li
Bob_Li - avatar
0
i like your answers, but it doesnt give me an exact answer, can you specify if its a yes or no
20th Aug 2024, 8:39 PM
rblx _pro
rblx _pro - avatar