On Oct 26, 2006, at 7:26 PM, Sarah Peeke (XERT) wrote:
The methods I describe in this article use ems for positioning, not
pixels:
http://www.alistapart.com/articles/multicolumnlists/
My favorite method is the last (#6). Have you found that it doesn't
survive cross-browser? I'd be interested in your findings.
I saw your example 6, and it looks great. I maybe nitpicking but the
columns don't line up in Safari 2.0.4 or Opera 9.0.2 Mac. I know
they've
got a small audience generally, but I'm hoping to find something more
x-browser if possible.
Do you know a workaround for this?
Unfortunately, there are no workarounds. It all depends on how the
browser decides to round off the numbers: assume the computed height
of one <li> is 2.1em (font-size/line-height/padding); this might
compute to 33.6 px (@font-size=16px). Then you have to take the total
computed height of one column (number of <li> by 2.3em). Depending on
how browsers round the numbers of, you end up with a few (screen) px
difference.
How do you slice pixels on screen ? All browser use different methods
with Gecko being one of the more 'exact'.
In the case above, assuming five <li> in a column, Gecko will compute
the following numbers: 33/34/33/34/33 (equals 167px, where as the
compute height of the column is 168px). Other browsers will round off
the height of each <li> to 33px but make the total computed height
168px. See where we are going ?
Note: I simplify slightly above.
Philippe
---
Philippe Wittenbergh
<http://emps.l-c-n.com>
*******************************************************************
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
*******************************************************************
