-2

I am working on a webpage with an embedded javascript web app and the styling on that has messed up the padding on my web page. I would like to add padding around all the contents of the page so they are not completely pressed against the edge but nothing I seem to be doing is working. First i tried encompassing all the contents in the body with a div and adding CSS padding to that div but nothing. Then I tried adding padding to the body in the CSS file but nothing. Finally I tried *{ padding: 10, 10, 10, 10 px; } but still nothing. Any idea on how to add padding around all the contents of a webpage?

Sid M
  • 4,354
  • 4
  • 30
  • 50
Doug
  • 53
  • 1
  • 6

2 Answers2

3

Simple-

*{
   padding:5% /* or whatever */
}

Note- this is far from ideal. Better to use a full reset and amend accordingly. Eric Meyer's is fairly easy to decipher

Your syntax is wrong too, its *{padding: 10px 10px 10px 10px;}, no commas

AMEND FOR APPARENT OP USE -

body{
  padding: 10px;
}
ggdx
  • 3,024
  • 4
  • 32
  • 48
  • Not exactly what the OP is looking for. I can understand the confusion but he wants padding on the `body` only. – Paulie_D Jul 10 '14 at 14:45
  • I don't think this is the best solution because every object (such as buttons and text) received padding and that really messed things up. – Doug Jul 10 '14 at 14:48
  • Hence "far from ideal..." and amendment point. – ggdx Jul 10 '14 at 14:50
2

10 is an invalid value for padding. You're probably looking for px or %. Also, adding padding to * will add padding to every single element on the page, not just around the "edge" of the page.

body{
    padding: 10px;
}
Mooseman
  • 18,763
  • 14
  • 70
  • 93
  • Might want to add `box-sizing: border-box;` to that too if you notice a horizontal scrollbar. – Aibrean Jul 10 '14 at 14:46
  • @Aibrean That's OT, but yes. [Here's a good article](http://www.paulirish.com/2012/box-sizing-border-box-ftw/) on that. – Mooseman Jul 10 '14 at 14:50