Search code examples
htmlcsssummernote

Grey outline in Internet explorer when we set height to the div inside summernote editor

I am working in a summer note editor in which i had to add 2 lines with bottom border so user can type in the 2 lines.

enter image description here

I have added a div with the below css

.line {
     line-height:10px;
     height: 10px;
     border-botom: 1px solid #007272;
}

In IE alone I am getting an grey outline around the div

enter image description here

I would like to remove the outline when user focus to type something.kindly provide some inputs.

Solution

  • I have fixed the issue by removing the height and line-height and adjusting with the padding on top and bottom.

    The issue was when setting the height to any element inside summer note editor that outline is coming up in IE, so removed it and adjusted with padding.

    This issue is little bit strange. I was unable to fix it in the local environment initially with the above-said code and fixed it while debugging in the high environment.