[Icon] File Image Outline Icon - Applies image style

[icelord2]

Steps to Reproduce

1. Add the File Image Outline icon

notice since the icon has image in its class name it applies the following
.ui.header>.image, .ui.header>img {
display: inline-block;
margin-top: .14285em;
width: 2.5em;
height: auto;
vertical-align: middle;
}

Expected
The width should be the same as the icon

Result
The Icon is applying the image style making it wider which can put it on a new line

Testcase

[yaboi]

I was having this problem, too. My HTML code renders as so:

<h1 class="ui top attached small header">
    <i class="fitted image icon"></i> Post Overview
</h1>

image icon is the only icon in the header with a width of 2.5em (by default) because it's picking up the .image class. The fix for this is to add :not(.icon) to line 82 in src/definitions/elements/header.less. Code would look like this:

.ui.header > .image:not(.icon),
.ui.header > img {
  display: inline-block;
  margin-top: @imageOffset;
  width: @imageWidth;
  height: @imageHeight;
  vertical-align: @imageAlignment;
}

[jlukic]

Thanks for your patience here. The fix you suggested is quite reasonable. Added in 2.2.8