Feedback for my tribute page [Jimmi Hendrix]

[dejesus]

Hi to all. I would really appreciate any feedback from this first project of mine.
Doing this project made me realize how hard is to create an design (so many hours changing color to end up choosing black and white), specially with specifications, but i’ve tried my best to put a little of my own design.

Also, for some reason i can’t wrap my head around why the element with id “a-source” aligns to the right. I’ve tried a lot of different things to align, but nothing works.

Here’s the link. Thanks for your feedback in advance.

[jwilkins.oboe]

Hi @dejesus !

Welcome to the forum!

I think your page looks good.

@dejesus

Doing this project made me realize how hard is to create an design

Most developers are not designers so you are in good company.
The important thing is that you created something on your own and learned in the process.

@dejesus

for some reason i can’t wrap my head around why the element with id “a-source” aligns to the right

You wrote this in your code
text-align: right !important;

But it looks like it is in the middle anyway so if you wanted it centered then maybe you can just delete that text-align right.

As for feedback, I think you did a good job.
I would review the lesson in giving links meaningful names

freeCodeCamp.org

Wikipedia is not that accessible.

Hope that helps!

[dejesus]

@jwilkins.oboe Thanks for spend time to review.

But it looks like it is in the middle anyway so if you wanted it centered then maybe you can just delete that text-align right.

I actually wrote wrong. What I want is to “a-source” to show in the left, but it just doesn’t (and I don’t know why).

I would review the lesson in giving links meaningful names

I totally agree with you in this.

Again, thanks for the feedback.

[hilbug]

@ dejesus Do you want it to line up with the other bullet points? You could move it into the ul, add li, give it a class of no-bullet and set the CSS as follows:

<li class="no-bullet">
   <a href="https://worldhistoryproject.org/topics/jimi-hendrix" id="a-source" class="dark-font" target="_blank">Fonte.</a>
</li>

.no-bullet {
  list-style-type: none;
}

#a-source {
 margin-bottom: 3px;
 text-decoration: none;
}

I think it’s inheriting its alignment from main otherwise. Let me know how that works out.

[jwilkins.oboe]

As mentioned earlier, you set your main content to have everything centered.

Maybe you could mess around with align-items in the a-source selector.

align-items | CSS-Tricks

[dejesus]

Sorry for the late response. I wanna thank both @jwilkins.oboe and @hilbug for your feedback. The reason that i was having the problem with the “a-source” is due to a lack of understanding of how block and inline elements work and who those are. Since anchor tags are inline elements, it needs a block element to be able to align right.

@jwilkins.oboe I’ve also tried to improve the names of links.

Again, thanks both for your feedback