The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS responsive css padding

  • This topic is empty.
Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
  • #46063

    Hi guys,

    Can anyone tell me how to add padding to the left and right sides of the blue boxes when the page has been moved to a smaller width and has changed to the responsive view. At the minute if I try and add padding the boxes move outwords and beyond the sides :(

    here is the link

    Any help would be greatly appreciated.


    At the moment when your media query kicks in the div width becomes 100% + padding.

    Use **box-sizing: border-box;** so browsers won’t add the padding to the overall width.

    This explains it better (and has all the browser pre-fixes):


    You have to subtract the padding from the width.
    If you want the width to be 100% and you want to give it a padding of 5%, then you have to change the width to 90%. And so on.


    Thanks for the help guys. CodeGraphics I used your technique and it worked fine.

    Thanks again :)

Viewing 4 posts - 1 through 4 (of 4 total)
  • The forum ‘CSS’ is closed to new topics and replies.