@snehamoybag
Posted
Hi @Peteonthebeat
Looks like your site is not loaded as the index.html is inside of a folder/directory. I'd recommended you to put the files outside of the Qr~Code-Component
folder and then update the solution π
And also answering to your query, justify-content: center
and align-items: center
should center a div both horizontally and vertically when the parent container has a set height
. If the parent container doesn't have a height
, align-items
property won't work when flex-direction
is set to row
.
Similarly, justify-content
won't work when the parent container doesn't have a height
and its flex-direction
is set to column
. ππ
Marked as helpful
@Peteonthebeat
Posted
Hello @snehamoybag !
Thank you for the extensive feedback! I'll definitely consider your advice on centering divs. I also already submitted the files as they are outside of the folder. So I hope now everything works properly. I should have done that initially, but I'm new to this. I appreciate your understanding!
Kind Regards!
@snehamoybag
Posted
Hi @Peteonthebeat,
The file structure should be something like this :
- images folder containing all the images
- stylesheets folder containing all the css files
- scripts folder containing all the script files index.html or any other html file should be outside of any folder.
And make sure css and script files are linked properly in the html file otherwise it wont load.
Also you can check out the full guide of submitting solution
@Peteonthebeat
Posted
Hey @snehamoybag, Let me clarify, if I understand correctly.
I need a total of 3 folders:
1 Called 'images' to contain all the images; 1 Called 'stylesheets' to have all my CSS files; for instance: styles.scss, styles.CSS.map, and styles.css 1 Called 'scripts' including all my HTML files, like index.html.
I link my HTML and CSS files by using a link tag like this:
<link rel="stylesheet" href="styles/styles.css" />in the head of my HTML file.
Thanks for the feedback and guidance!
Regards!
@snehamoybag
Posted
@Peteonthebeat generally these are the main 3 folders you gonna need.. I'd recommend you to google more about this topic, such as
- how to setup file structure for web site development
- and how to link the stylesheets/scripts etc file to
.html
files ππ
Marked as helpful
@Peteonthebeat
Posted
Hey @snehamoybag, I am sorry to bother you again. I'm trying to update my solution, and everything works (let's just say) almost perfectly when I test the project with VS Code Live Server (cmd + L + O).
I also uploaded the files (no folders) by manually dragging and dropping them into the brand-new repository I created.
However, my project looks like plain HTML when I test things through the provided Github link. There are no images, and there's absolutely no CSS. That is not how things are in my actual project.
I wonder whether you would share some insights on how to fix this, so I can upload the solution and move to the next challenge.
Sincere, Pete