Fiber Landing Page 

{"ops":[{"insert":"A blog page perfect for practicing both Flex and Grid. Beginner level.\n"}]}

Unifeed Blog Page

{"ops":[{"insert":"Perfect to practice creating % based containers and using flex or grid.\n"}]}

Newsletter Popup Template

This is perfect! My only comment is that in tablet size the image in the 'Diversify your portfolio' section isn't fixed to the bottom and is instead in a square that is vertically and horizontally centered. Other than that, great job! 

How long did this take you?

Well done! My only comment is that it isn't completely responsive on mobile, there's margin on the left of the blog posts after the main one.

Thank you for the feedback. I fixed that issue with the align-self property of flexbox.
It took 3-4 hours to complete the project.

Very well done for only 3-4 hours of coding! 

Click the 'Sign Up' button to see the register design. 

This is so awesome, I love how you've implemented the scrollable testimonials section, VERY clean, good job!

What problems are you having when trying to use the font face? My only comment is to use align-items: center; on this class 'articles__secondary--container' to center the text with the image, other than great job, very responsive!

Thank you moeminm !
I dowloaded the font face Manrope, but it's as if it wasn't taken into account and the code uses Verdana instead :

@font-face {
  font-family: "Manrope";
  src: url("./fonts/Manrope-VariableFont_wght.ttf") format ("truetype");
}

* {
  margin: 0;
  font-family: "Manrope", "Verdana", "Times New Roman";
}

Did you import the font? Check this article out https://css-tricks.com/snippets/css/using-font-face/

Alternatively, you can just link the font in the <head> using this: 

<link rel="preconnect" href="https://fonts.gstatic.com"> 
<link href="https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;700&display=swap" rel="stylesheet">

and adding font-family: 'Manrope', sans-serif; in the CSS.

I think you've nailed it, I do recommend increasing the line height to make it more readable, text feels too squished together!

Great work, my only comment is to make the padding 1rem all around instead of 2 and 1.

Coding isn't my expertise so i'll leave that to someone else, you've done a great job at making it responsive.

My comments are all spacing and font-related. You'll find that the sign up button, for example, has a different font-size than the rest of the navbar elements. There's a lot white space in all sections, I recommend you use a container with a width of 1140px. The shadows on the testimonials section are also harsh. 

Other than that, I think you've done a really great job, keep it up!



You've nailed this one IMO, great job. TimeNow is a free template and has a landing page and a pricing page, you might like it, check it out!

Well done! The 'Start Free Trial' is broken for me, i'm using Safari if that helps.

Glad you're taking the initiative to focus more on accessibility! This looks really good, my only comment would be to have the sign up page take up the entire page instead of being centered. Great job otherwise!!

Love it! Looks really clean on all sizes, you've done a wonderful job :)

Your Implementation was spot on, great work!

The animations were a silver lining to the great layout

I like the scale effect you added to some buttons, I would've never thought of using that, really cool man.
also the scrollbar it's really cool

👋Hi vishalbrdr!

For the "View live project" link, it's a GitHub repo link.

Have uploaded your project to Netlify or GitHub page?

Live project link seems to be working fine for me

Hello! You've done great. Here are my feedbacks
-  I noticed you made use of padding with percentage as the unit on each section, this isn't a very good idea cause on a very large screen it could break the layout and make it look messy.

I'll advice you have a container class like this:

```
.container {

}
```

I'm sorry for sending the message without completing it...

.container {
   width: 90%;
   max-width: 1200px;
   margin: 0 auto;
}

Then you can use that class around each section of your page, allowing the sections to have the same max-width;

Also using the unit percentage isn't really the most efficient way, cause it's relative to its parent.  I advise you to learn about units like rem and em.



Hello! You've done great, I have some suggestions that you could work on 

So I noticed you made use of these properties on each section, I'm guessing you're making use of the padding for mobile devices view, which is totally cool but here another approach.

// yours
header, main, footer {
    margin: 0 auto;
    max-width: 1000px;
    padding: 0 30px;
}

// another approach
.container {
   width: 90%;
   max-width: 1000px;
  margin: 0 auto;
}

the width of 90% does give mobile devices some space, which fixes the padding. But your implementation is all good though.

Also I notice this:

<div class="header-wrap">

</div>

Also I noticed this:

<div class="header-wrap">
  <header> .... </header>
</div>

Semantically there's no need for the div element, you could use the header, main, footer elements directly.

Lastly, the solution lacks white space, majority of the elements are too close to each other. 

That's all, I hope it was helpful even though you didn't ask :)

Hello! Thank you so much for your feedback! I'll note and implement it for my next project! ^^

Great! but the menu shows to unfolded in mobile version 

Hi There, I just checked your solution you have attempted it very well. Keep doing the good work. Hope you build more 🔥💜

  background-repeat: no-repeat;
  background-size: cover;

para que el fondo no se repita se vea como el diseño,
saludos desde mexico.

https://github.com/yewinag/news-letter-ui

Wow. Clean coded and responsive one. Amazing :) 

nice site. but when you reduce the page size with ctrl - the site contents fly around

Fiber

Unifeed

{"ops":[{"insert":"Using Bootstrap and vanilla JS.\n"}]}

Fun project that took about a day

{"ops":[{"insert":"Please help me review my source code\n"}]}

Request review NewsletterPopupTemplate

Unifeed blog page using React

{"ops":[{"insert":"Created using Next.js\n"}]}

Fiber Landing Page

Short and sweet

{"ops":[{"insert":"Simple solution.\n"}]}

Newsletter Popup

Fiber Codewell Challenge

Fiber Challenge with HTML5, CSS, JAVASCRIPT, SASS

Fiber landing page with SCSS

Fiber Landing Page using SCSS 

Build Using SCSS

Slap dashie pass

Fibr landing page with accessibility and srcset

Fiber Lading Page, sign up incoming... 

Fiber 

Newsletter popup template challenge

{"ops":[{"insert":"Purely used the Bootstrap 5 base classes to structure and style the form.\n"}]}

Newsie - Codewell challenge

Fiber Landing page solution

{"ops":[{"insert":"I had fun trying to make this responsive and as pixel close as the designs\n"}]}

Newsletter Solution

{"ops":[{"insert":"Developed popup Template\n"}]}

{"ops":[{"insert":"Easy with bootstrap grid :D.\n"}]}

Unifeed Blog

C.J Fiber Demo 

React Tailwind css

Fiber Landing Page - Built with Gasby

{"ops":[{"insert":"This is an awesome challenge.\n"}]}

Completed using Bootstrap

Fiber Landing page with signup form, slick slider carousel + mobile nav menu

{"ops":[{"insert":"made a fully responsive react website, with mobile menu and signup page\n"}]}

Fiber landing page with react

{"ops":[{"insert":"Newsletter popup with email validation using javascript. Flexbox.\n"}]}

Newsletter popup with email validation

 Solution Fiber landing page Using HTML and CSS

{"ops":[{"insert":"This is my first Codewell solution. \n"}]}

Mobile first Responsive Fiber landing page (HTML&CSS)

{"ops":[{"insert":"This is Fiber website create with both HTML and CSS\n"}]}

finishes this with HTML, CSS and JS

Done with Grid and Flex box

{"ops":[{"insert":"I made the whole thing usign the grid system of bootstrap for responsive\n"}]}

Responsive Fiber website, made using bootstrap and js

{"ops":[{"insert":"Challenge built with HTML, CSS and JavaScript\n\t\t\t\n"}]}

Unifeed Blog 

Finished This Challenge with HTML CSS and JS

Fiber landing page made with html and css

{"ops":[{"insert":"Used html, css and js\n"}]}

Fiber Portfolio

Tailwind grid experiment

{"ops":[{"insert":"Best for beginners to get knowledge of basics.\n"}]}

Finally done but  i tried  Responsive web but cant Done

nice experience

Newsletter Popup | HTML CSS Sass

Fiber Clone 

{"ops":[{"insert":"Hi everyone, I appreciate any feedback, thanks 😊\n"}]}

Newsletter Template - Mobile first

{"ops":[{"insert":"I made it with Html Sass and some JavaScript\n"}]}

{"ops":[{"insert":"Anyone can comment :)\n"}]}

Unifeed Blog Template with HTML and CSS

{"ops":[{"insert":"No Bootstrap and Js\n"}]}

Newsletter Popup Template Using HTML And CSS

{"ops":[{"insert":"Anyone can comment!\n"}]}

Fiber with HTML and CSS

Unifeed Blog Page (HTML&CSS)

Fully responsive solution with React and tailwindcss

{"ops":[{"insert":"Really nice challenge, I enjoyed a lot 😀.\n"}]}

Fiber full responsive with TailwindCSS

Completed this website using html and css.

{"ops":[{"insert":"click SignUp button to see the form\n"}]}

Fiber Main page with Form Register

Fiber Codewell

{"ops":[{"insert":"Used HTML and CSS, It was an interesting project\n"}]}

Solution using flex box, responsive units, and Javascript.

{"ops":[{"insert":"Any feeback will be appreciated.\n"}]}

Unifeed Blog Template using Bootstrap 5.1

{"ops":[{"insert":"no interesting parts since challenges was pretty simple\n"}]}

newsletter popup

{"ops":[{"insert":"any suggestions?\n"}]}

news-letter-card

Unifeed Blog - Template (Challenge)

{"ops":[{"insert":"I would love to hear your feedback 😁\n"}]}

{"ops":[{"insert":"It was an awsome project to practice.\n"}]}

{"ops":[{"insert":"Built with Bootstrap 5.\n"}]}

Fiber - Create Portfolio in Minutes

Fiber Landing Page with SCSS & JS

Fiber Project Made with SCSS and Bootstrap5

{"ops":[{"insert":"Landing page built using html css and javascript.\n"}]}

Fiber Landing page

{"ops":[{"insert":"Great real life project\n\n"}]}

Fiber solution by Mr. Ravi

Fiber Landing Page by Hayden

{"ops":[{"insert":"Any feedback would be great!\n"}]}

Fiber landing page

{"ops":[{"insert":"CUALQUIER DUDA DE COMO LO HICE PREGUNTAR\n\n"}]}

PRIMER DESAFIO RESUELTO 

Fiber Started Files

{"ops":[{"insert":"Any improvements or suggestions are more than welcome.\n"}]}

Simple html, css, and jquery

{"ops":[{"insert":"This is my first project here. So, any feedback are welcome\n"}]}

Responsive Newsletter Popup

Fiber Challenge

{"ops":[{"insert":"This Challenge was easy \n"}]}

Newsletter

{"ops":[{"insert":"This is my first solution in codewell\n"}]}

My first challenge on Codewell

{"ops":[{"insert":"Any advice would be great.\n"}]}

Responsive Unifeed Page

{"ops":[{"insert":"Easy challenge, any feedback is still welcome tho\n"}]}

Popup newsletter built with HTML, CSS and JS

SCSS, JSON, Dark theme  in Logo

newsletter challenge

Fiber landing page + signup page 

Unifeed Blog Page Made with SCSS , Used Normalize

{"ops":[{"insert":"Developed using CSS Flexbox.\n\nI used modal to visualize the PopUp.\n"}]}

Newsletter Popup Starter Files

Fiber website solution

fiber landing page

Responsive mobile first landing page Fiber

{"ops":[{"insert":"I used SASS to make code easier.\n"}]}

Newsletter Popup 

Unifeed-Blog-Template-Starter

Newsletter-Popup-Starter

Fiber Starter

{"ops":[{"insert":"That's an amazing project. "},{"attributes":{"align":"center"},"insert":"\n"}]}

Newsletter Popup Template.

{"ops":[{"insert":"I used reactjs & scss to make styling \n"}]}

news-letter

{"ops":[{"insert":"reactjs and scss\n"}]}

news-letter-ui

Fiber landing page & signup

{"ops":[{"insert":"I used Grid + Flexbox combo this time for this challenge. \n"}]}

Challenge Completed using HTML and CSS 

{"ops":[{"insert":"Amazing Project.\n"}]}

Unifeed-Blog-Template

{"ops":[{"insert":"Used basic CSS styling with Flexbox. \n"}]}

{"ops":[{"insert":"Is everything okay? or you have feedback?\n"}]}

Newsletter-Popup-Template

{"ops":[{"insert":"It was a great project.\n"}]}

Newsletter Popup Design

{"ops":[{"insert":"This was a great project. I used CSS basic and flexbox.\n"}]}

{"ops":[{"insert":"Successfully completed this Challenge using css flex-box.\n"}]}

Newsletter Modal Template

{"ops":[{"insert":"A fun small project using React and styled components\n"}]}

Responsive Landing Page using React and Styled Components

News Letter Popup Template

Unifeed Blog Template using SCSS

Newsie Newsletter Card

Newsletter Popup challenge

{"ops":[{"insert":"I really like using flexbox, it greatly simplifies the work to be done\n"}]}

Fiber landing page

Fiber Landing Page

Fiber Landing Page made with Sass & JavaScript