The following are links to additional questions that our community has asked about this exercise:
This list will contain other frequently asked questions that aren’t quite as popular as the ones above.
Currently there have not been enough questions asked and answered about this exercise to populate this FAQ section.
This FAQ is built and maintained by you, the Codecademy community – help yourself and other learners like you by contributing!
Not seeing your question? It may still have been asked before – try searching for it by clicking the spyglass icon () in the top-right of this page. Still can’t find it? Ask it below by hitting the reply button below this post ().
ids are unique, so you when having ids you know you are dealing with a single element on the page. This can be very useful when your page grows and the number of elements increases
furthermore, ids have a higher priority when it comes to resolving conflicting css properties
So you mean I can use ids only on one element on the web page… is it just to look unique ? I tried using another id too it worked… we create those id’s right, we ourselves have to give the priority according to the need right ?
In part 8 of this exercise, in the style.css file I wrote a CSS selector for class attributes, and then in part 9 underneath that I wrote a selector for an ID attribute. When I added the corresponding ID value to an h1 element in the index.html, having not deleted the class value written from the part 8, I noticed that the CSS for the ID became displayed in the browser.
Does this mean that CSS selectors for IDs overwrite those for class even when the ID selectors are written lower down in the hierarchy of the cascade on the style.css file?
that is part of it, the other part is that css uses a point system to resolve conflicting properties (the higher the specificity, the more points). Which looks like this:
element: 1 point, so for example p is 1 point
class: 10 points, so .class_example is 10 points
id: 100 points, so #id_example is 100 points
using the style attribute: 1000 points
so .class_example p would be 11 points
given ids have a higher specificity, the ID will always overrule the class selector in case of conflicting properties (so even if you place the ID before the class selector)
if the points are equal, the latest property gets applied
this even applies when you have multiple stylesheet:
<style>
p { color: red }
</style>
<style>
p { color: blue }
</style>
the paragraph will be blue, even if those stylesheet where external (so with <link rel="stylesheet" href="#">)
ids should be unique (unfortunately not enforced by the browser), so we as programmers should enforce unique id’s. Furthermore, ids have higher specificity, which is important when you have conflicting css properties for an element
Does the ID attribute overrides Class attribute in CSS. For example if the class selector for an element has color red,and ID selector for the same element has color green.
I haven’t tried myself, but I do know that id would override class because a class is made to target multiple element whereas an id is only made to target that one specific element
This is how my text ended up looking. I am far from an expert, but I would not call this cursive. Did I do something wrong? I checked all my code, but I can’t see anything.
My code in CSS: #article-title {font-family: cursive;
text-transform: capitalize;}
And in index:
h1 id=“article-title” class=“title uppercase”>Top Vacation Spots</h1
(with the brackets obviously. I had to remove them because otherwise it wouldn’t show the code)