<div>にかかっているuser agent stylesheetを無効化できない

RubyonRailsを利用して、headerのパーシャルを作成しています。
ヘッダーの要素を横並びにレイアウトしたいのですが、<div>がブロック要素のままで勝手に改行されてしまいレイアウトが整えられずに困っています。chromeのデベロッパーツールを使って該当箇所を確認するとuser agent stylesheetが効いていて、自分で書いたscssが当たっていないようです。
セレクタの優先順位…など確認して試行錯誤しているのですがうまくいかず、ご助言いただけないでしょうか？

↓無効化したいCSS「user agent stylesheet」

CSS
1div {
2  display: block;
3}

↓適用したいCSS「custom.scss」

CSS
1div .logo_part {
2    display: inline_block !important;
3}

↓対象のHTML「_header.html.erb」

HTML
1<header class="navbar navbar-fixed-top">
2  <div class="header_container">
3    <div class="logo_part">
4      <i class="fab fa-instagram fa-2x my-gray"></i>
5      <%= link_to "InstaClone", '/', id: "logo", :style=>"color:gray;" %>
6    </div>
7    
8    <div class="searchbar_part active-cyan-4 ">
9      <input class="form-control" type="text" placeholder="Search" aria-label="Search">
10    </div>
11
12    <div class="icons_part">
13        <ul>
14          <li><a href="#"><i class="far fa-compass fa-2x my-gray"></i></a></li>
15          <li><a href="#"><i class="far fa-heart fa-2x my-gray"></i></a></li>
16          <%= link_to current_user do %>
17            <i class="far fa-user fa-2x my-gray"></i>
18　　　　  <% end %>
19        </ul>
20    </div>
21  </div>
22</header>