On 28.07.2012 13:29, Markus Ernst wrote:
http://www.rapid.ch/de/rapid-einachsgeraete/prospekte.html
The headings here match the width of 3 image elements plus borders and
the 2 margins between them. With space characters added to the
margins, the width cannot be caluclated reliably anymore.
Maybe you know a workaround for this, too?
Sort of - in a round-about way. The "auto added" space is approx .5em
either side of an inline-block, so by subtracting 1em from margin at
front-side (often means negative front-margin) and offsetting the blocks
(position: relative) to line up 1em further in - where they should show
up, you can achieve pretty pixel-accurate margin calculations. Test and
tweak subtracted value and offset till line-up is as stable as can be,
and use backside margins to create wanted space.
In most cases I simply set margins in em, .5em less that I want the
blocks spaced. But since em is not always the right unit to make sure
all blocks line up as intended in a more pixel controlled design, the
"round-about" is how I do it while waiting for the calc() property to be
supported across browser-land.
FYI: I have added more line-up variants for the inline-block method
itself - a total of 6 variants listed here...
http://www.gunlaug.com/contents/test/
Have not included the margin tweaking you ask for yet, but may later.
regards
Georg
______________________________________________________________________
css-discuss [css-d@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/
