Build a Website Style Guide Challenge Project (HTML, CSS)

Projects Challenge Projects
1420

Here’s my design system - TIA for your feedback!
https://github.com/dustymurph/design-system

1421

Hello everyone, here is my project:

dani8bits.github.io_website-style-guide_ (1)
dani8bits.github.io_website-style-guide_ (1)1665×4764 348 KB

The links:
https://dani8bits.github.io/website-style-guide/

2 Likes
1422

Here is my project

https://bens88-cloud.github.io/Website_Style_Guide/index.html

1 Like
1423

Hey,

here is my project: My Web Design Style
Feel free to give me advise! I was trying to make the header and the footer the same width as the page, but nothing worked :expressionless: I tried everything Google had to offer :sweat_smile:
Thanks and have a great day!

1424

This is my site:

https://banana649.github.io/bananacheatsheet.github.io/stylesheet.html

Please let me know how did I fare and how I can improve. Thank you.

2 Likes
1425

Hello Everyone,

This is my design system site:
https://nd9.github.io/Design-system-guide/

Please let me know how I did and how we can improve this.

2 Likes
1426

Hello,

Here is the basic website style guide that I made. I think I will edit it and add more stylistic elements as I continue in the course.

Link to my Guide on GitHub Pages

1427

Can you show me your code, like your github repository? I’ve got some decent experience with what you’re having trouble with.

1428

Thanks! Here is the repository:

1429

Alright I understand what your possible problem was, you most likely were trying to set the width of the footer to “width: 100%”, what this would do will expand the width to the maximum width of the parent container, your footer tag is within the body tag, making the body the parent container, which the body has been set to a display of inline-block, which will be as wide as it takes to fit all the children within it unless a specific width is specified. If you try to set the width of the footer with pixels that would work, or what you can do is set the width of the body and footer to 100% which will bring every child to the center of the screen, which then you can play around with it to make it go to the left again. But to be honest, there is no reason to use inline-block for the body since there isn’t any other element beside it, as the purpose behind it is if you want other block elements side by side each other instead of on top.

1 Like
1430

Thanks for the insight! That solved it!

1 Like
1432

Hi,

This is the link to My Website Style Guide repository: GitHub - phayze2184/style-guide.github.io: My website style guide: color palette, fonts, headings.
And here is the link to the published version: https://phayze2184.github.io/style-guide.github.io/.

Any suggestions are well received.

Thank you.

1433

I really like your H1 font.

1434

Hi everyone, here my website for website design system challenge. For anyone who wanna look on my code and wanna give me a feedback are welcome, here my css code: website-design-system/resources/styles.css at main · nurularifin83/website-design-system · GitHub

1435

Hello everyone,
that’s my solution!
HTML

CSS

Thanks in advance to everyone correcting it or suggesting new ways to improve it!

Regards,
F.

1436

A live version of my project. Had a lot of troubles with making it responsive.

https://snazzy-frangollo-6df4f9.netlify.app/

1 Like
1437

Hi everyone! Would greatly appreciate your thoughts on my project: My Website Style Guide. Thanks in advance!

1438

This is my Website Design System project published in GitHub pages:

site: Website Design System

Repository: GitHub - jorgeortega618/websitedesingsystem

1 Like
1439

Here is my Website Style Guide

github: GitHub - eliazar-lopez/Eliazar_Website_Style_Guide: custom style guide using HTML and CSS
live: I AM THE TITLE!

1 Like
1440

Hey There :slight_smile:
Here is mine:

https://melek22.github.io/

1 Like