Re: width and height

On 25/01/2011 19:14, Bruno wrote:
But then why margin and padding works

Yes, they do work for these so-called inline elements (such as <a>) 
which flow in a line rather like text (and whose most common purpose is 
indeed to contain text).  However, they don't always do what you expect: 
vertical margins and padding won't have any affect on the final position 
of the box, that is, they will bleed out of the line box in which the 
box sites and hence they will possibly overlap other line boxes and 
their contents.

This is because line box height is intimately related to font size, and 
for inline elements it was decided that is typographically preferable to 
prevent vertical margin, border, padding and indeed height from 
influencing or overriding that behaviour.

Insofar as width is concerned, it is the contents of the box which 
determines the width, and again it's not possible to override that. 
This is partly because the box might not lie on one line; it might be 
split over two or more lines instead, and its "end" might be further to 
the left than its "start" in left-to-right text rendering!  What would 
width even mean there?

As Tab says, inline-block will solve your problem.

Cheers,
Anton Prowse
http://dev.moohnhenge.net

Received on Tuesday, 25 January 2011 18:50:15 UTC