Hello everyone
I used position: absolte in my CSS and i got a problem when i reduce the size of the page ! The text doesn’t fit in the page .
that’s my code link: https://codepen.io/toufikbens/pen/XWjpQNG
hi there,
when you change the width of ul#secondary? Do you mean this part?
Hello !
Yes exactly !
Hi @toufikbens, that’s unfortunately an effect of using “position absolute” on elements.
As the name suggest, no matter what happens to the screen, or other elements on that page, the absolute element will stay in that position “no matter what”.
There are ways to fix that, but they are incredibly inefficient and “painful”.
Nowadays there are way better tools to deal with this kind of problem, mainly letting the browser calculate the space needed and position accordingly.
Since this is what likely you will use in the future, I suggest you to take a look at either css flex or css grid .
My suggestion of a good resource to refresh on those notions is
css-tricks guides on flexbox or grid.
Hope it helps 
2 Likes
a simple solution can be adding a media query. @media(max-width: xxx px); and then define new rules for that element.
2 Likes