Rob freeman wrote: > I'm sure its to do with the headings at 110% how can I make sure the > arrow icon always sits centred vertically next to the headings?
> http://www.coloursense.net/testfolder/ Don't know why you get variations between two setups of Firefox - different screen-resolutions maybe. However, position of background with pixel-values next to text, depends on "frozen" font-size, line-height and other setup-alterable variables, and none of these variables can be controlled or guaranteed across browser-land and setups. The vertical line-up is for instance easily disturbed by introducing even the slightest font-resizing. Somewhat "improved control" can be achieved by "playing along" with the unknown variables, and leave to the browsers to calculate line-ups. They are usually quite good at it when fed balanced and tested styles. One way to do it in your case, is to... 1: even out the top and bottom padding, and get back the position/line-up by adding a margin-top: #content h1 { padding: 3px 0; margin-top: 7px; } 2: you now have two options. 2 a: make the background center vertically no matter what - even if the headline-text breaks into 2 lines: #content h1 { background-position: 0 50%; } Note: the vertical centering is in the headline itself, so if the text breaks into two lines the background will center vertically between those lines. Background-image is positioned by its vertical center with the given value. 2 b: make the background center vertically with the text-line - also if the headline-text breaks into 2 lines: #content h1 { background-position: 0 .5em; } Note: exact em-value depends on case and size of background-image. Since the background doesn't change size with font-resizing, some slight misalignment will take place if the font-resizing is made large enough, because the background-image is positioned by its top edge and not its vertical center. regards Georg -- http://www.gunlaug.no ______________________________________________________________________ css-discuss [EMAIL PROTECTED] 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/
