Space-between disapears with position fixed in header

HTML-CSS
1

Tell us what’s happening:
I’m trying to reproduce the Product Landing Page header. To do so, I was planning on using CSS flexbox, with justify-content: space-between. It works perfectly, but when I was to lock this on the top of the viewport with position: fixed, the space-between disapears.

Am I doing something wrong ?

  **Your code so far**

At line 35 in the CSS editor

  **Your browser information:**

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:89.0) Gecko/20100101 Firefox/89.0

Challenge: Build a Product Landing Page

Link to the challenge:

2

I’ve solved my problem thanks to this topic :

You can’t use both quoted properties on the same element.

Basically, you have to set up a <div> (or directly the <header>) that is , position:fixed, and inside, create another <div> with the justify-content: space-between CSS property.

1 Like
3

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.