Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Is it bad practice to use Negative Margins or Padding in CSS [closed]

Tags:

css

Take for example this image below of a project I am working on... The Blue background is a DIV that is inside of another DIV that wraps all that sidebar contact section together. To get the Blue BG DIV to have the round border and not have a gap because of the parents margin/padding I had to use negative margins
margin: -9px -2px 8px -6px;

So the question is, is it bad practice to use Negative Margins or Padding?

enter image description here

like image 928
JasonDavis Avatar asked Dec 30 '11 23:12

JasonDavis


People also ask

Is it good practice to use negative margins?

Using negative margin is considered bad practice as it makes the code more complex and difficult for developer's understanding. Generally there is no need to use negative margin, unless and until you have made any error elsewhere.

Should I use padding or margin CSS?

Use a margin when you want to adjust the spacing of an element and use padding when you want to adjust the appearance of the element itself. Margins aren't a part of the element; padding is.

Can you have negative padding CSS?

No. Padding only takes positive values. Negatives are ignored or treated as 0, which would have the same effect: none.


2 Answers

No; it's not bad practice, so long as you're aware of the fact you're using negative margins, and that this necessarily 'pulls'/'moves' elements from their otherwise-'normal' position.

Why would you even worry about this?

like image 170
David Thomas Avatar answered Sep 21 '22 11:09

David Thomas


Negative margins are a great way to negate the padding inside of an element for headings etc. I have found no negative results (pardon the pun) of using negative margins. E.g:

<div style="padding:10px;border:1px solid blue;">  <div style="margin:-10px -10px 10px -10px;backgorund-color:yellow;">Full width heading</div>  The content of the div which is now padded in by ten pixels. <div> 

I was worried about negative margins when I first discovered them but have found them to be very useful is so many layout areas- actually reducing div counts and cleaning up layout code.

like image 32
MadScientist Avatar answered Sep 20 '22 11:09

MadScientist