Question 43201 in Html Question posted in
Some basic documentation can be found here.

How to make a padding start at a max value when full screen but shrink gradually to minimum value as browser width gets smaller? – Html

I’ve been using padding-left: clamp( 60px, calc( value – value ), 186px) but can’t seem to figure out how to shrink the paddding properly when i shrink the width of my browser

Tags:

2

Answers


  1. Chosen as BEST ANSWER
    0

    Found a solution for my problem. Ended up using an extra div with a percentage width and used a min-width + max-width on my desired values.


  2. 0

    Use ems instead of pixels. the browser default of 1em is 16 pixels, and ems change relative to the size of the parent, but work a bit differently when used for margins, padding, and widths

    .example {
font-size: 1rem;
padding: 1em;
}

    In the example above, the padding will be relative to the font-size instead of the parent. So the padding will shrink as the font size shrinks, and grow when the font size grows.

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search