Search code examples
htmlcsscomputed-style

Cannot remove extra margin/padding between divs even though reset.css used


I've been trying everything i know for the past 1.5 hours and cannot figure this one out. Actually far as i can tell, margin and padding are at 0, however, the containing divs are so far, inexplicably 4px wider and 1px taller then the containing image. I don't know where that comes from.

Few things which may be causing this:

  1. I'm setting the max-width and max-height of the images via javascript to the size of the window.
  2. I'm working with a combination of table, table-cell and inline-blocks to set typography in the way i need it.
  3. Also working with body and html at 100% width and height
  4. This is a Tumblr theme customisation (started from scratch though)

Code wise, it's hard to put the entire lot in here, so for now, I'll just give the link.

Hopefully if this can be figured out I'll be able to post the problem code in this question so it's good for reference in the future.

The link: http://syndex.me

Thanks


Solution

  • In this case, i could not use float:left as there seems to be no reliable way to achieve center aligned series of divs using it. The answer is pretty simple, any mark-up within the inline-blocked, center aligned wrapper/child sequence needs to have no white space in between them, and should be wrapped in one continuous line of code. Pretty stupid, but it works 100% for this scenario.