Re: [css-d] Aligning a floated image with the top of following text
On 11/8/10 12:27 AM, Thierry Koblentz wrote: Part of the way into revising my little site, I noticed that the top edge each floated image was about four pixels above the top of the capital letter(s) of the text that immediately followed. I found a solution; using padding to push the image down a bit. But I never understood why that four-pixel disparity was there in the first place? http://www.keithpurtell.com/kthings/atget.htm This space is called half-leading. It is half the difference between the value of line-height and font-size. If the image does not have the same space above it, it is because leading is not applied to replaced elements. -- Regards, aside If it takes me a thousand years I will never remember to forget to nit-pick and to /validate the markup/ of a new-site or a makeover of an old-site to a strict or html5 doctype. !DOCTYPE HTML PUBLIC -//W3C//DTD HTML 4.01//EN http://www.w3.org/TR/html4/strict.dtd; Best, Studs Terkel Chicago -- :: desktop and mobile :: http://chelseacreekstudio.com/ __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Aligning a floated image with the top of following text
On 11/7/10 9:27 PM, Thierry Koblentz wrote: Part of the way into revising my little site, I noticed that the top edge each floated image was about four pixels above the top of the capital letter(s) of the text that immediately followed. I found a solution; using padding to push the image down a bit. But I never understood why that four-pixel disparity was there in the first place? http://www.keithpurtell.com/kthings/atget.htm This space is called half-leading. It is half the difference between the value of line-height and font-size. If the image does not have the same space above it, it is because leading is not applied to replaced elements. Exactly so. In addition, I believe there may be additional space above each capital letter for diacritical marks. Anyone? Cordially, David -- __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Aligning a floated image with the top of following text
Part of the way into revising my little site, I noticed that the top edge each floated image was about four pixels above the top of the capital letter(s) of the text that immediately followed. I found a solution; using padding to push the image down a bit. But I never understood why that four-pixel disparity was there in the first place? http://www.keithpurtell.com/kthings/atget.htm - Keith Purtell __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Aligning a floated image with the top of following text
Part of the way into revising my little site, I noticed that the top edge each floated image was about four pixels above the top of the capital letter(s) of the text that immediately followed. I found a solution; using padding to push the image down a bit. But I never understood why that four-pixel disparity was there in the first place? http://www.keithpurtell.com/kthings/atget.htm This space is called half-leading. It is half the difference between the value of line-height and font-size. If the image does not have the same space above it, it is because leading is not applied to replaced elements. -- Regards, Thierry www.tjkdesign.com | www.ez-css.org | @thierrykoblentz __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/