responsive feedback page
I am making a responsive e_ commerce website but i am facing a problem in a page . I am unable to make it responsive after 600px . I am facing some problems in the width and text area. If somebody knows how to fix it please help me
https://codepen.io/Hamza-Nawaz-the-solid/pen/RwqVYKp
3 Replies
When you share a codepen, please be sure to have the CSS in in the CSS pane and not in a
stlye element. It makes it really hard to navigate and read.
As for your "responsive" site…it's anything but. You have pixel values and absolute positioning everywhere…that's not how you make a responsive site. Aboslute positioning should be your absolute last resort when nothing else works.
* The content should dictate both the width and height of the element. You can set max values (or use clamp() for the normal value)
* Element size should be adjusted with padding, not a set height/width
* Space between elements should be done either with margin or with flexbox/grid
* Margin and padding should be done in em, not px
* Font size should be using rem not px
* Line height should be using unitless numbers (1.5, 2, etc) as that is a multiple of the current font size (defualt is 1.2, which is kinda low, you should add line-height: 1.5 to your body element)
* If you find yourself using !important you should instead re-do your code to embrace the cascade and not need it. It's a sign of spaghetti codeHow can i edit text area to make it responsive
Use percentage-based width and height. Right now it’s in a very small flex container si till need to fix that first