Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS why the first two icons's line-height does not work in chrome?

  • This topic is empty.
Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
    Posts
  • #269902
    jcy0322
    Participant

    why the first two icons’s line-height does not work in chrome? and result in the first two icon is taller than the third icon, how to fix that
    https://codepen.io/knight-w/pen/QmeejX

    #269903
    jcy0322
    Participant

    it works well in code pen ,but when i move the code to separate html and css files, the first 2 icons get higher than the third

    #269907
    AsGYakimov
    Participant

    It’s OK for me in Chrome and Firefox. Is this the only CSS you have? Maybe some other style affects them.

    #269908
    jcy0322
    Participant

    yes , this is the only css , it still shows the first two icon is higher than the third icon both in my chrome and fire fox, it only works normally on code pen….

    #269919
    bearhead
    Participant

    Are you using any additional css? Maybe bootstrap or some other framework?

    #269947
    jcy0322
    Participant

    no , this is the only css, i just fix it by adding the line “!DOCTYPE HTML”(with angle brackets i can not type it here) to the top of the html, after that the first two icons behave normally, but i don’t know why that will work

    #269948
    jcy0322
    Participant

    but once i remove !DOCTYPE HTML from the top my html page, the first two icons are still higher than the third , i don’t know why that works

    #269965
    Pranab
    Participant

    Your reference (codepen) and also in firefox and chrome, are working fine for me.

    It’s really tough to understand when what you tell is happened only for you and what you give (your reference) is working fine for others.

    If icons width or height bigger than the other icons then just fix it manually with setting width and height. That’s the only way i think.

    like that i.some-selector{width: put width; height: put height}

    #270018
    jcy0322
    Participant

    without this line “!DOCTYPE HTML” on top of the html file, it will appear

Viewing 9 posts - 1 through 9 (of 9 total)
  • The forum ‘CSS’ is closed to new topics and replies.