I have a couple of questions about margin

Divs don’'t have default margins unlike ‘p’ elements or heading elements (to name but a few) so there is no need to add margin:0 to them.

On your second div you have margin-bottom of 24px so in order to pull your third div upwards you have to pull it up 50px + 24px = 74px to get it level. You have used -75px and that is why you are 1 pixel out and the boxes are not level.

Generally you should avoid magic numbers like the plague and let items flow naturally from each other.

However if all you are doing is moving fixed sized coloured blocks around then it probably doesn’t matter but you have been shown many times how to do this naturally and with little effort. Imagine if you changed the size of one of those coloured blocks then you would have to work out all those dimensions and margins again and changed every single line of inline code in your page rather than a simple tweak in a css file.

Yes you can use inline styles and yes you can use negative margins but no its not good practice and no it is not maintainable.

5 Likes