Thursday, April 12, 2018

Negative right margins are legit.

Do you know how you may set a negative top margin on a div to make it sort of sit a few pixels on top of the thing that is pushing it down to where it is? ...and, for that matter, how you may set a negative left margin to pull a div a bit leftward from whatever it is pressed against at its left? Negative bottom margins behave kinda strangely, huh? It is akin to putting the same setting for a negative top margin to the div below the div you are styling. Anyhow, I experimented today with a negative right margin! I had a div sitting inside of another div which had both a reactive flexible width that could vary with the browser's width and ten pixels of padding on the right and left side. I needed the nested to div to be a different color for a callout at the base of a content area and also really run edge to edge of the div it sat in, ignoring the fact that it would be otherwise scrunched by the padding. The fix was to set a negative left margin and a negative right margin of ten pixels each at the nested callout div. The right margin makes the div jut rightward past its rightward bounds a number of pixels that is the reciprocal of its negative number, ten.

No comments:

Post a Comment