On Feb 4, 2008, at 4:53 AM, Juli Zanocco wrote:
> And a little problem with FireFox:
> On this page: http://www.newmoonfarm.net/Farm-pages/Image2.html
> I have arrow gifs used as background images in paragraph tags.
> Safari and Explorer (even IE5mac) expand the block to encompass the
> gifs but Firefox does not. I've had to add a bunch of nbsp's to get
> the gifs to show. What am I doing wrong here?
Firefox 2 doesn't support 'display:inline-block', and treats your
links as inline elements; in that case 'width' (and 'height') is not
applied (correct).
A better solution for those links is to drop the specified width
completely, and use padding-left/padding-right to create a space for
the background image.
e.g.
.previous {
display: inline-block; /* Fx2 won't understand this, but in htis case
it doesn't matter much */
padding-left: 50px;/* wider than the image */
margin-right:5px;
background: url(../images/previousarrow.gif) no-repeat 0 2px;
/* adjust padding-top and padding-bottom to taste */
}
This also has the advantage of being much more friendly for font-
resizing.
Philippe
---
Philippe Wittenbergh
http://l-c-n.com/
______________________________________________________________________
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/
