First time, would love some feedback

First time, would love some feedback
0

#1

Hey everyone,

I really appreciate this community so far-- I’ve gone through the beginning tutorial and just finished the first project assignment in codepen. I was hoping to get any feedback, tips, suggestions, helpful advice, observations, etc.

Specifically, if someone could help me understand why the mobile version on my iphone safari app when I load the codepen weblink to my page looks so much different/pretty terrible–I would appreciate it

I’m extremely new to coding, please keep that in mind. That said, I would love to catch some potentially problematic habits early on so that I don’t repeat them moving forward.

Thank you everyone, this resource has been so amazing so far

To start, I will start sifting through other topics/threads with similar “first project feedback” titles and go from there.


#2

Hey @hb4242r2vfbs,
great looking tribute site. Your investment in it really shows. :+1:

If you are looking to understand why your site isn’t responsive(able to adjust on different screens), I would start looking at a library called Bootstrap and into Media Queries.

Other than that, I noticed you used a lot of br elements. You might consider using CSS attributes like padding and margin to get spacing and alignment correctly for elements.

I would also name my CSS classes with something meaningful and not just txt1.

Hope that helps.


#3

It does help, I appreciate the feedback!


#4

Hey @TomerPacific ! I spent today reworking the code and tried to utilize your feedback. Can you please check it one more time for me and let me know what your thoughts are? When you find time, of course.

removing the linebreak commands and forcing myself to work the design positioning using css was pretty helpful, and helped me learn a lot more!

Also, I was wondering why I couldn’t get codepen to do javascript for me. I typed the following:

$(document).ready(function(){
$("li").addClass("text-center")
});

I’m just using text-center as an example, and li as the list element I tried targeting, but I also tried “h” and “p” and several different variants to see if the code would just work at all-- I couldn’t get it to work.

I appreciate your feedback.


#5

@hb4242r2vfbs,
glad I could be of assistance.
I looked over your code and I’m sure you can see as well as I do, that it is a lot more readable and friendly. Good job :
Regarding the code you wrote in the above post. You are using JQuery which is a Javascript library. If you want to use it inside your CodePen project, you need to add it. You can do so , by going to Settings ->Javascript and at the bottom is a Quick-add dropdown. From there you can choose JQuery.
You can also add JQuery directly using a script tag in your body element.

If you want to learn about JQuery, you can do so here:
https://jquery.com/

https://www.w3schools.com/JQuery/