MVC5+Bootstrap3で、feedbackグリフがテキストボックスからはみ出る

Question

前提・実現したいこと

お世話になります。
Visual Studio 2017 Professional (15.7.0) で、ASP.NET Webアプリケーション (MVC5) を作成しています。

発生している問題・エラーメッセージ

アイコン（グリフ glyphicon-search）が、テキストボックスからはみ出てしまいます。

該当のソースコード

スケルトンコードのindex.cshtmlに改造をしたものです。

@{
    ViewBag.Title = "Home Page";
}

<div class="jumbotron">
    <h1>ASP.NET</h1>
    <p class="lead">ASP.NET is a free web framework for building great Web sites and Web applications using HTML, CSS and JavaScript.</p>
    <p><a href="https://asp.net" class="btn btn-primary btn-lg">Learn more &raquo;</a></p>
</div>

<div class="row">
    <div class="col-md-4">
        <h2>Getting started</h2>
        @using (Html.BeginForm("Search", "Home"))
        {
            <div class="form-group has-feedback">
                <input type="text" class="form-control" />
                <span class="glyphicon glyphicon-search form-control-feedback"></span>
            </div>
        }
    </div>
mp</div>

試したこと

span を i にしたり、Form (@Html.BeginForm) を外してみたりしましたが、だめでした。何がわるいのか見つけられません。

補足情報（FW/ツールのバージョンなど）

Visual Studio 2017 Professional

Answer 1

glyphicon-search in input をキーワードにググって調べただけですが（なので未検証・未確認ですが）、以下の記事の Answers に書いてあるようにしてできそうです。

Add Bootstrap Glyphicon to Input Box
https://stackoverflow.com/questions/18838964/add-bootstrap-glyphicon-to-input-box

Comments

[hsk]

どうもありがとうございます。実は今回ここのページを見て作成しました。
グリフは表示されるのですが、はみ出てしまうことを改善したいです。

[退会済みユーザー]

そういうことは後出ししないで、最初の質問に書いてください。回答者・閲覧者に失礼な話で、こういうサイトではマナー違反といっても過言ではないと思います。

[hsk]

＞アイコン（グリフ glyphicon-search）が、テキストボックスからはみ出てしまいます。
とはじめから書いていますが...太字にでもしておけば宜しかったでしょうか？

[退会済みユーザー]

「実は今回ここのページを見て作成しました」のページとは、私が上の回答で紹介した記事 Add Bootstrap Glyphicon to Input Box のことと理解していますが、そうであれば、その記事のことは知っているということを、その記事の URL を明示して、最初の質問に書いておくべきと言っているのです。

[hsk]

そうですけど、他のページもたくさん見ているのに、全部列挙せよと？
あなたは滅多に質問されないかもしれませんが、質問するときはそうしている（そうするつもり）のですか？
質問に対する回答でなかったのにせっかく回答いただいたので、余談で書いたのですけれど。
グリフ自体は出力できていることくらい、質問内容を見ればわかりますよね？
大丈夫ですか？失礼うんぬん語られる前に、あなた自身が私の質問をよく見ていなかった類でしょう？

[退会済みユーザー]

CSS の問題なのに、あなたの質問では肝心の CSS の定義が不明なのに、ここに書いてあること以外は知り得ない第三者に十分な情報を提供できているとは思っていないですよね。最初に、Add Bootstrap Glyphicon to Input Box を参考にしたこと、with / wothout Bootstrap のどちらでやっているかなどの情報があるのとないのとで、全く話が違ってくることが理解できないですか？

[hsk]

しつこいですね。ブラックリストに入れたいです。
私の質問をみて、正解をご存知の方からしっかり正答をいただけていますし、これ以上何を噛みつきたいのですか？
まずMVC.NETは知っているのですか？「ASP.NET Webアプリケーション (MVC5) を作成しています」「スケルトンコードのindex.cshtmlに改造をしたものです」で、どんな状況かわかる方にはわかるので、こうして正しいご回答もいただけたのです。
回答する自信があって、それでも不明瞭なら運営者様が「追記・修正依頼」欄をわざわざ設けられています。
ずいぶん居丈高にコメントを続けてきますが、あなたの的外れな回答があったせいで、本来正答をご存知だった方が、私の質問を読むことをパスしてしまった可能性もあるのに、あなたは何も感じませんか？正答をお持ちの方のご回答チャンスをつぶし、自身がBAでなかったからか果ては他人を萎えさせるようなことを執拗に書いて付け回して、さらに続けますか？

もし納得なさらないのなら、私にではなく、運営者様に訴えられたらと思いますよ。
退会ユーザーさんの中にも、どなたかによるこのような類の「逆切れ的な」執着的コメントのせいで、SNSへの参加を萎縮させられ無念の思いをされた故の方もいろいろおられるのかなとおもうと非常に残念でなりません。日本の将来のエンジニア界にとって、仲間が減った損失は計り知れない。
とにかく、コメントで付け回されても困りますので、お嫌なら何か申告でもなさってはいかが？

[退会済みユーザー]

では、ブラックリストに入れといてください。こちらもそうします。

[hsk]

はい。詳しくない分野なのでしたらあなたから無理してご回答いただかなくてよいのです。

Answer 2

ASP.NET MVC デフォルトでは Site.css というちょっと余計なスタイルシートを読み込みます。その中にこの記述があります。

input,
select,
textarea {
    max-width: 280px;
}

これを消すか、なんなら読み込まないようBundleConfig.csを書き換えてしまってもいいでしょう。

Comments

[hsk]

どうも有難う御座います！
Site.css の該当箇所をコメントアウトしたところ、グリフがうまく枠内に入りました。
大変助かりました！