Ugly margin in the example page

[Puntocom]

Hi, I don't know exactly where to post this, I found an ugly margin in the example page linked in the Google search results for XenForo query:

http://xenforo.com/community/pages/example-page/

 

[Paul B]

I've moved this to feedback as it's not a bug with the software but just some dodgy HTML on a Page

 

[CyberAP]

It is the padding problem, not the margin one.

 

[Jaxel]

It is the padding problem, not the margin one.

Well technically it can be fixed with padding or margin...

In this specific case, I would fix it with margin, not padding. Padding is used for inside of a div. Margin is used for outside of a div. In this case, you want to have a margin outside of the division that holds the image. Yes, this can be done just as easy with padding, but for semantics, you're looking for margin.

I personally try to use margin as much as possible and only resort to padding when the area I need shifted is within the content div. The major difference is that margins collapse, while padding does not. If you have two DIVs, side by side, both with padding of 10, where the two DIVs meet in the middle will have a combined space between of 20. If you do it with margin instead, it would collapse the margin and end up with a combined space between of only 10.

 

[Kier]

I thought margins only collapsed vertically?

*goes to check

 

[---MAD---]

Seems fine for me.. unless I am looking at the wrong thing..

 

[Paul B]

Seems fine for me.. unless I am looking at the wrong thing..

I just checked the Google preview and it looks fine to me too.

 

[dutchbb]

My nickname in the Google XF serp, what an honour