【やりたいこと】
ログインしているユーザー毎にヘッダーの「user」「admin」「superior」のロゴを表示させようとしたら他のリンクが改行されてしまっているので改行されないようにしたい。
【試したこと】
white-space: nowrap;を試したが変化なし
【質問】
改行している原因がわからないのですがヘッダーを一行に表示させるにはどうしたらいいでしょうか?
<header class="navbar navbar-fixed-top navbar-inverse"> <div class="container"> <%= link_to "勤怠システム", root_path, id: "logo" %> <% if logged_in? %> ←追加したコード <% if current_user.admin? %> ← <p class="logo admin">Admin</p> ← <% elsif current_user.superior? %> ← <p class="logo superior">Superior</p> ← <% else %> ← <p class="logo user">User</p> ← <% end %> ← <% end %> ← <nav> <ul class="nav navbar-nav navbar-right"> <li><%= link_to "ホーム", root_path %></li> <% if logged_in? %> <% if current_user.admin? %> <li><%= link_to "ユーザ一覧", users_path %></li> <% end %> <% else %> <li><%= link_to "ログイン", login_path %></li> <% end %> </ul> </nav> </div> </header>
.logo{ font-size: 15px; padding-top: 12px; } .superior{ color: #FF0; } .user{ color: #33FFCC; } .admin{ color: #F00; } ul{ white-space: nowrap; } #logo { float: left; margin-right: 10px; font-size: 1.7em; color: white; text-transform: uppercase; letter-spacing: -1px; padding-top: 9px; font-weight: bold; &:hover { color: white; text-decoration: none; } }
回答1件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。