Submitted almost 2 years ago

Intro-section-with-dropdown-navigation --> Fully css, no JS!

Harm Intemann• 590

@ghintema

Preview site View code

This is a solution for...

Intro section with dropdown navigation

HTML
CSS
JS

2junior

View challenge

Design comparison

SolutionDesign

Solution retrospective

At first I didn't notice that there's supposed to be JS involved in this Challenge. So I started tackling the challenge using css only. Now I'm wondering what do you need JS for in this challenge? I think I got all the functionality and interactivity using only css. Did I miss something? To make the slidebar visible I used <input type="checkbox" id="Name"> and <label for="Name"> together with pseudo-class input:checked as selector.

Any feedback welcome and highly appreciated !!! :)

Community feedback

Lahiru Shiran• 100

@lahirusb97

Posted almost 2 years ago

i learned this just now ( input#hamburger-check:checked ~ #hamburger-icon) thanks you. i love that arrow rotating animation and side bar animation

1.after width1400px content is fixed to width 400px and centerd side have space 1000px white i think you can increse your text and image size to manage that large white space. try to look some design on dribble.com you will get the idea.

**** thanks you so much for the feedback i shouldn't use 2 nav bars like that ****

Marked as helpful

Please log in to post a comment

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord