CSS Mozilla: Make Mozilla not ignore height style of an inline element

Discussion in 'HTML' started by Henri, Feb 20, 2005.

  1. Henri

    Henri Guest

    Hi,

    I'm trying to display an icon before a link, inside a sentence, using CSS.
    My icon is 16x16px large.
    It displays well in IE but Mozilla ignore the height style (because a link
    is an inline element) and the bottom part of the icon is not displayed.
    Isn't there a way to make Mozilla not ignore the height style and get the
    icon fully displayed?
    (I know I could use a bigger font to get it working but I would prefer
    another way)

    ..linkClass {
    height: 16px;
    font-family: Tahoma, Arial, sans-serif;
    font-size: 12px;
    background: transparent url(icon.gif) no-repeat;
    padding-left: 22px;
    white-space: nowrap;
    -moz-user-select: none;
    }

    <A href="link.html" class="linkClass">Hello</A>

    Thanks

    Henri
    Henri, Feb 20, 2005
    #1
    1. Advertising

  2. Henri

    Els Guest

    Henri wrote:

    > Hi,
    >
    > I'm trying to display an icon before a link, inside a
    > sentence, using CSS. My icon is 16x16px large.
    > It displays well in IE but Mozilla ignore the height style
    > (because a link is an inline element) and the bottom part
    > of the icon is not displayed. Isn't there a way to make
    > Mozilla not ignore the height style and get the icon fully
    > displayed? (I know I could use a bigger font to get it
    > working but I would prefer another way)


    Use line-height instead of height, or make the link a block
    element.

    --
    Els
    http://locusmeus.com/
    Sonhos vem. Sonhos vão. O resto é imperfeito.
    - Renato Russo -
    Els, Feb 20, 2005
    #2
    1. Advertising

  3. Henri

    Henri Guest

    Sorry but line-height doesn't work either.

    But I've found the solution ! :))
    Just needed to add

    display: -moz-inline-box;

    Thanks anyway for your answer.

    Henri


    "Els" <> a écrit dans le message de
    news:Xns960485CEFC43Els@130.133.1.4...
    > Henri wrote:
    >
    > > Hi,
    > >
    > > I'm trying to display an icon before a link, inside a
    > > sentence, using CSS. My icon is 16x16px large.
    > > It displays well in IE but Mozilla ignore the height style
    > > (because a link is an inline element) and the bottom part
    > > of the icon is not displayed. Isn't there a way to make
    > > Mozilla not ignore the height style and get the icon fully
    > > displayed? (I know I could use a bigger font to get it
    > > working but I would prefer another way)

    >
    > Use line-height instead of height, or make the link a block
    > element.
    >
    > --
    > Els
    > http://locusmeus.com/
    > Sonhos vem. Sonhos vão. O resto é imperfeito.
    > - Renato Russo -
    >
    Henri, Feb 21, 2005
    #3
  4. Henri

    Toby Inkster Guest

    Henri wrote:

    > display: -moz-inline-box;


    I'd also add:

    display: inline-block;

    For the benefit of standards compliant browsers.

    --
    Toby A Inkster BSc (Hons) ARCS
    Contact Me ~ http://tobyinkster.co.uk/contact
    Toby Inkster, Feb 21, 2005
    #4
  5. Henri

    Henri Guest

    Thanks Toby :)

    "Toby Inkster" <> a écrit dans le message de
    news:p...
    > Henri wrote:
    >
    > > display: -moz-inline-box;

    >
    > I'd also add:
    >
    > display: inline-block;
    >
    > For the benefit of standards compliant browsers.
    >
    > --
    > Toby A Inkster BSc (Hons) ARCS
    > Contact Me ~ http://tobyinkster.co.uk/contact
    >
    >
    Henri, Feb 21, 2005
    #5
  6. Re: CSS Mozilla: Make Mozilla not ignore height style of an inlineelement

    Toby Inkster wrote:
    > Henri wrote:
    >
    >>display: -moz-inline-box;

    >
    > I'd also add:
    >
    > display: inline-block;
    >
    > For the benefit of standards compliant browsers.


    For the benefit of browsers which comply to that particular bit of the
    standard, you mean. Mozilla implements parts of the standard that Opera
    doesn't, just as Opera implements parts that Mozilla doesn't.
    Leif K-Brooks, Feb 21, 2005
    #6
  7. Re: CSS Mozilla: Make Mozilla not ignore height style of an inline element

    in alt.html, Leif K-Brooks wrote:
    > Toby Inkster wrote:
    > > Henri wrote:
    > >
    > >>display: -moz-inline-box;


    Does somebody know why it is still with -moz- prefix? If I have
    understood correctly, there must be something different than in standard?
    (Operas implemention is broken, and I asked them to remove broken support
    when version number was under 7.2..., but they insist on having broken
    support whiout prefix. Why is good question, as they do support
    display:inline-table, which can be often used instead.)

    > > I'd also add:
    > >
    > > display: inline-block;
    > >
    > > For the benefit of standards compliant browsers.

    >
    > For the benefit of browsers which comply to that particular bit of the
    > standard, you mean.


    Who knows, maybe aliens have standards complient browsers? Or some secret
    cult? Or maybe there is one around in 2006. (quite likely, unless big
    mistake is made)

    > Mozilla implements parts of the standard that Opera
    > doesn't,


    Like? (asking,because at the moment I can't think anything in CSS21 or
    CSS2 that would go in this category. Unless we take floats, where Opera
    has different bugs than mozillas)

    > just as Opera implements parts that Mozilla doesn't.


    Yes.


    --
    Lauri Raittila <http://www.iki.fi/lr> <http://www.iki.fi/zwak/fonts>
    Utrecht, NL.
    Lauri Raittila, Feb 21, 2005
    #7
  8. Henri

    Toby Inkster Guest

    Leif K-Brooks wrote:

    > Mozilla implements parts of the standard that Opera doesn't


    I really can't think of what parts of either CSS standard that Gecko
    implements but Opera doesn't. Except... Mozilla supports all the CSS 2.0
    list-style-types, whereas Opera only supports the more limited subset
    found in CSS 2.1.

    --
    Toby A Inkster BSc (Hons) ARCS
    Contact Me ~ http://tobyinkster.co.uk/contact
    Toby Inkster, Feb 22, 2005
    #8
  9. Re: CSS Mozilla: Make Mozilla not ignore height style of an inlineelement

    Toby Inkster wrote:
    > Leif K-Brooks wrote:
    >
    >
    >>Mozilla implements parts of the standard that Opera doesn't

    >
    >
    > I really can't think of what parts of either CSS standard that Gecko
    > implements but Opera doesn't. Except... Mozilla supports all the CSS 2.0
    > list-style-types, whereas Opera only supports the more limited subset
    > found in CSS 2.1.


    http://www.w3.org/Style/CSS/Test/CSS2.1/20041125/t051202-c26-psudo-nest-00-c.xht

    "In addition, the entire first line should be in a small-caps font and
    teal." Mozilla gets that right, Opera doesn't.
    Leif K-Brooks, Feb 22, 2005
    #9
  10. Henri

    Toby Inkster Guest

    Leif K-Brooks wrote:
    > Toby Inkster wrote:
    >> Leif K-Brooks wrote:
    >>
    >>> Mozilla implements parts of the standard that Opera doesn't

    >>
    >> I really can't think of what parts of either CSS standard that Gecko
    >> implements but Opera doesn't. Except...

    >
    > http://www.w3.org/Style/CSS/Test/CSS2.1/20041125/t051202-c26-psudo-nest-00-c.xht
    >
    > "In addition, the entire first line should be in a small-caps font and
    > teal." Mozilla gets that right, Opera doesn't.


    This bug only occurs with XML mime types -- text/html is fine.

    This bug only occurs with selectors like "p:first-line" and not
    with ".myparagraph:first-line" which will work fine.

    Opera does *support* ":first-line". I never claimed that Opera's
    implementation is bug-free, just that it's a comparatively complete
    implementation of CSS.

    --
    Toby A Inkster BSc (Hons) ARCS
    Contact Me ~ http://tobyinkster.co.uk/contact
    Toby Inkster, Feb 22, 2005
    #10
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. Woolly Mittens
    Replies:
    8
    Views:
    430
    Woolly Mittens
    Sep 22, 2003
  2. Monty
    Replies:
    3
    Views:
    4,805
    Monty
    Aug 19, 2004
  3. Lois
    Replies:
    1
    Views:
    3,215
    Ryan Stewart
    Dec 27, 2004
  4. Rob Meade
    Replies:
    6
    Views:
    264
    Rob Meade
    Mar 1, 2004
  5. Patrick
    Replies:
    2
    Views:
    139
    Patrick
    Aug 26, 2003
Loading...

Share This Page