質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
Webサイト

一つのドメイン上に存在するWebページの集合体をWebサイトと呼びます。

Bootstrap

BootstrapはウェブサイトデザインやUIのWebアプリケーションを素早く 作成する可能なCSSフレームワークです。 Twitter風のデザインを作成することができます。

HTML

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

Q&A

解決済

2回答

3044閲覧

Bootstrap3で、「panel-heading」に記述した「ドロップダウンリスト」の中身が表示されない。

Generalist

総合スコア11

Webサイト

一つのドメイン上に存在するWebページの集合体をWebサイトと呼びます。

Bootstrap

BootstrapはウェブサイトデザインやUIのWebアプリケーションを素早く 作成する可能なCSSフレームワークです。 Twitter風のデザインを作成することができます。

HTML

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

0グッド

0クリップ

投稿2015/04/13 11:12

Bootstrap3.3.4を使用して、WEBサイトを制作しています。

以下のコードを記述し、
「パネル」コンポーネントの
パネルヘッダーにドロップダウンリスト(ボタン付き)を配置しましたが、
クリックすると、空白のリストが表示されてしまいます。

<div class="panel"> <div class="panel-heading">
<form class="form-inline"> <div class="form-group"> <input type="text"class="form-control"> <div class="btn-group"> <button class="btn btn-primary">カメラ</button> <button class="btn btn-primary dropdown-toggle" data-toggle="dropdown"> <span class="caret"></span> </button> <ul class="dropdown-menu"> <li>カメラ</li> <li>カメラ</li> </ul> </div> </div> </form> </div> <div class="panel-body"> </div>

※リストを表示させると、「カメラ、カメラ」と表示されるはずが、リストは表示されるも、空白で表示される。パネルヘッダー以外にこのドロップダウンリストのコードを記述すると、「カメラ、カメラ」と正常に表示される。

どなたかご教授ください。
よろしくお願い致します。

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答2

0

本番ソースで、
該当箇所のフォント色が「color:#f0f8ff」となっており、
ドロップダウンリストの色も同系色だったため、
表示はされているが、
文字が見えない状態となっていた。
「color:#f0f8ff」を外し、デフォルトフォント色とすることで、
問題なく表示されることを確認しました。

お騒がせ致しました。

※次からはブラウザ等開発環境も記述するようにしようと思います。アドバイスありがとうございました

投稿2015/04/13 12:14

Generalist

総合スコア11

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

0

ベストアンサー

こちらの環境(Chrome41)では問題なく動作しているようです
使用されているブラウザなど教えていただければ他の方も回答しやすいかもしれません

投稿2015/04/13 11:53

Yahagi

総合スコア13

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

Generalist

2015/04/13 12:12

Chromeバージョン 41.0.2272.118 mを使用していました。 再度確認してみた所、問題無く表示されたため、ソースを見返してみると、 該当箇所のフォント色が「color:#f0f8ff」となっていました・・・。 フォント色をデフォルトに戻すと、問題なく表示されました。 ご検証ありがとうございました。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問