inline elements 1

[jimmyshoes]

I understand that inline elements are laid out in lines and so vertical placement does not apply

If this is the case, then why is it that <img> can be padded 'all round' whereas <span> can only be padded left and right

<div style="border:1px solid #000000">
<img src="1.jpg" style="padding:29px"/>
</div>

<div style="border:1px solid #000000">
<span style="padding:29px">Text</span>
</div>

 

[BillyRayPreachersSon]

Images, along with some other elements such as form inputs) are not normal elements - they are what is known as "replaced elements" (see

http://www.w3.org/TR/CSS21/conform.html).

Replaced elements often have different formatting abilities to regular inline elements, as you've found.

Hope this helps,
Dan



Coedit Limited - Delivering standards compliant, accessible web solutions

Dan's Page [blue]@[/blue] Code Couch:

http://www.codecouch.com/dan/

Code Couch Tech Snippets & Info:

http://www.codecouch.com/

 

[BillyRayPreachersSon]

See also

http://www.webdeveloper.com/forum/archive/index.php/t-444.html

and

http://www.dynamicdrive.com/forums/showthread.php?t=3045.

Dan



Coedit Limited - Delivering standards compliant, accessible web solutions

Dan's Page [blue]@[/blue] Code Couch:

http://www.codecouch.com/dan/

Code Couch Tech Snippets & Info:

http://www.codecouch.com/

 

[jimmyshoes]

Thanks