57176

IE creates font-icon strange underline

I'm using fontello font-icons. They work perfectly except with Internet Explorer. They do not react also with the hover status and so... The problem I'm getting at this moment is a trange underline under the font-icon.

I already tried text-decoration, border-bottom...

Do anybody have any solution for this:

<img src="https://i.stack.imgur.com/JIYjm.jpg" alt="enter image description here">

This is my CSS code, I'm using SASS in this project:

nav{ a{ width: 60px; height: $height-header-nav-tablet; float: left; line-height: 50px; text-align: center; @media screen and (min-width : $media-tablet-min) and (max-width : $media-tablet-max) { width: $width-header-link-nav-tablet; } i.icon-menu{ font-size: 30px; } &:link, &:visited{ color: $blue-dark-takeda; @include border-gradient; text-shadow: 1px 1px rgba(28, 42, 83, 0.2); } &:hover{ color: $white-takeda; background-color: $blue-dark-takeda; text-shadow: 1px 1px rgba(0, 0, 0, 0.2); } &:active{ @include background-image(radial-gradient(45px 45px, $blue-dark-takeda 25px, #111931 40px)); } &.active { color: $white-takeda; background-color: $blue-dark-takeda; text-shadow: 1px 1px rgba(0, 0, 0, 0.2); @include background-image(radial-gradient(45px 45px, $blue-dark-takeda 25px, #111931 40px)); } } }

Answer1:

After trying out different solutions I found the solution. Strangely enough all the rest of browsers do not display this strange underline, only IE. So I applied text-decoration: none; to header nav a and it worked. My error was to apply this text-decoration to the icon itself.

I do not understand why the other browser have never displayed this strange underline and IE does, but at least if somebody else has this issue the solution that worked for me was text-decoration: none.

Hope to help!!!

P.D. Thanks for the help dstorey

Answer2:

overflow: hidden fixes this problem

Recommend

  • How to make an Ionic content scroll
  • Jenkins Build Error: Build step 'Invoke top-level Maven targets' marked build as failure
  • TabBarController: Orienting views in different orientations
  • Yii2 disable highlighting menu item
  • UWP navigation (Template10), Pivot control, multiple frames
  • Declaration of does not work with Ionic's ion-nav-view in IBM MobileFirst
  • Simple test app deploys to Heroku but won't run
  • Does Apportable support to build library binary (.a/.so)?
  • Possible to “watch” both HAML and SASS at the same time?
  • Can't delete or rename original file after resizing
  • saving file generated by TCPDF
  • Jenkins: FATAL: Could not initialize class hudson.util.ProcessTree$UnixReflection
  • How to view images from protected folder with php?
  • D3 get axis values on zoom event
  • Adjust width of select element according to selected option's width
  • Textfile Structure (tables)
  • Custom validator control occupying space even though display set to dynamic
  • OpenGL 3.3 on Mac OSX El Capitan with LWJGL
  • Switching to Release Build causes runtime error in Web Reference
  • Change multiple background-images with jQuery
  • Excel - Autoshape get it's name from cell (value)
  • How to set/get protobuf's extension field in Go?
  • Why doesn't :active or :focus work on text links in webkit? (safari & chrome)
  • Check if a string to interpolate provides expected placeholders
  • Modifying destination and filename of gulp-svg-sprite
  • vba code to select only visible cells in specific column except heading
  • Change an a tag attribute in JavaScript based on screen width
  • How to show dropdown in excel using jrxml (jasper api)?
  • QuartzCore.framework for Mono Develop
  • RestKit - RKRequestDelegate does not exist
  • Traverse Array and Display in markup
  • NSLayoutConstraint that would pin a view to the bottom edge of a superview
  • Acquiring multiple attributes from .xml file in c#
  • CSS Applying specific rule for a specific monitor resolution with only CSS is posible?
  • How get height of the a view with gone visibility and height defined as wrap_content in xml?
  • How to CLICK on IE download dialog box i.e.(Open, Save, Save As…)
  • Change div Background jquery
  • How can I remove ASP.NET Designer.cs files?
  • python draw pie shapes with colour filled
  • java string with new operator and a literal