[twitter-bootstrap] タグが付いた質問
twitter-bootstrap タグの使い方はまだ書かれていません。
26
質問
0
票
1
回答
660
閲覧数
Bootstrapのhamburgar menuが動かない
下記のドキュメントのExternal contentの章で記述されているサンプルコードをそのまま
コピーすると、レイアウトはそのまま黒のヘッダーにアイコンという状態で再現できます。
https://getbootstrap.com/docs/4.1/components/navbar/
ただ、アイコンを押下してもメニューを展開できない状態です。
何か追加で設定する必要があるのでしょうか?
&...
1
票
1
回答
3,257
閲覧数
Vue.jsとBootstrapを両方使うのはありですか
フロントエンド開発を勉強しています。BootstrapやVue.jsを両方使うことはありでしょうか?
Bootstrapで見た目を整えて、Vue.jsのトランジションとアニメーションで動きをつけようと思っています
どちらもフロント関係のフレームワークなので両方使っていいのか疑問に思っています
0
票
0
回答
330
閲覧数
配列の要素を、プログレスバーに動的に表示したい
以下のように、配列から取得した値をBootstrap4のProgress Barで動的に表示したいです。
値は取得した時によって刻々変化します。
・プログレスバーの最大値:countで取得した、配列全体の要素数
・プログレスバーの各値:array_count_valuesで取得した、要素ごとの数
環境:
PHP 7.4.9
laravel7.28.1
今回、DBは使用しません。
...
0
票
1
回答
590
閲覧数
ローカルでは動くが、リモート環境で動かない時に考えられる事は何でしょうか?
Python,DjangoでWEBシステムの開発をしています。
まずはローカルで動きを確認してその後、リモートのサーバーにデプロイして、もう一度動きを確認しながら開発を行っています。
今回、ローカルでは動くが、リモートでは動かない状況となり、原因が分からず困っております。
解決に向け、方法等についてご教授いただきないでしょうか?
リモートで動かない状況
django-bootstrap-...
0
票
1
回答
2,493
閲覧数
django-bootstrap-datepicker-plusを利用したフォームがうまく機能しない
Python、Djangoを利用したWEBシステムをローカル環境で開発しています。
フォームで、カレンダー形式のウィジェットで年月日の情報を取得し、データベースへ登録という動きをさせるために、django-bootstrap-datepicker-plusのモジュールを使用しています。
公式ドキュメントを参考にして、コードを追加しているのですが、うまく機能しません。
参考にしたサイト:...
0
票
1
回答
167
閲覧数
bootstrapのdropdownで選択した画像を別の要素に表示させる方法
以下のコードで”newImg_boat”タブに選択後の画像を載せたいのですが、うまくいかず困っています。
コメントアウトしているコードは、あれやこれや試した結果です。2日くらい悩んでいます。
よろしくお願いいたします。
$(function() {
$('.dropdown-menu .dropdown-item').click(function() {
var ...
1
票
1
回答
274
閲覧数
jQueryの<script>内の記述とファイルの記述の違い
発生している問題
jQueryをhtmlファイルに<script>タブで記述する場合と
jsファイルに別途記述する場合では、挙動に差があるのでしょうか?
Bootstrapの練習のためにこちらのサンプルをRuby on Railsで試しに使ってみたのですが、
以下のjQueryをindex.html.erbに<script>タブで記述した場合は正常に動作しますが、
...
1
票
1
回答
413
閲覧数
bootstrapのタブ内で要素を横並びに出来ない
はじめまして。menu-image要素とmenu-text要素を横並びにしたいのですが、できずに困っています。初歩的な質問だとは思いますが、自身で解決できずに困っています。宜しくお願い致します。
.tab-pane {
display: flex;
}
.menu-tab {
display: flex;
width: 50%;
background-...
3
票
1
回答
138
閲覧数
coverなのに画像の高さが無効化される
bootstrap4でサムネイルリストを作りましたが、そのCSSでobject-fitにcoverとしたにも関わらず、画像の高さがcoverになりません。どうすれば改善するのでしょうか?
HTML
<div class="container">
<div class="row">
<div class="col-6">
<...
4
票
2
回答
352
閲覧数
どうして.containerで15pxして.rowで-15pxするのでしょうか?
基本的にBootstrapは.containerで括ってその中で.rowを記述していく書き方をします。
なのに何故、わざわざBootstrapは.containerで15pxして.rowで-15pxしているのでしょうか?
該当ソースリンク:
https://github.com/twbs/bootstrap/blob/v4-dev/dist/css/bootstrap-grid.css#L22
...
1
票
1
回答
200
閲覧数
HTMLテキストフィールドの高さを合わせる方法は?
このTwitterページの上部ログインフォームにて、アカウント名フィールドとパスワードフィールドの上辺の位置が揃っています。
これを再現しようとCSSを考えているのですが、参考にデベロッパーツールで確認してもどこにその指定があるのか分かりません。
分かる方いらっしゃいますか?調べ方もご教示いただけたら助かります。
1
票
1
回答
4,220
閲覧数
ハンバーガーメニューが開かない
ハンバーガーメニューが開きません。
下のように書きました。
@media all and (min-width: 500px) {
body,
html {
margin: 0;
height: 100%;
}
#page-container {
display: grid;
grid-template-columns: ...
0
票
1
回答
753
閲覧数
Bootstrap Modal 内にAjaxで表示
#mymodalの.modal-body内にphpfile.phpで呼び出された内容を表示したいのですが、以下のコードではうまくいきません。
modalは出て来るし、ajaxでなければ表示されるので、modal内へのページの読み込みができていないと言うことでしょうが…。
function addCart(id){
$('#mymodal .modal-body').load("...
1
票
1
回答
2,447
閲覧数
bootstrap のmodal がiOSの端末でスクロール出来ない
bootstrap3でmodal内で検索できるような仕組みを作りました。テキストボックスの内容をAjaxでPHPに送信して結果をJsonで受け取ります。その内容をmodal内で表示するのですが、結果が多くなったときにスクロール(スワイプ)が出来ない状況になりました。どうもこの現象がiOSの端末のみで発生しているようです。
この解決方法をご存知の方がいらっしゃったら教えて下さい。
1
票
1
回答
423
閲覧数
jqueryでtableの中身を上から読み込む(複数行)
jqueryでmodal上にあるテーブルを読み込み、
一部のカラムをhtml上にtemplateで読み込ませて表示させたいです。
今のところ、eachを使えば読み込めると思ったのですが
tableの最終行しか読み込まれませんでした。
これは参考にしたURLです
jqueryで要素のある順に番号をつける
//コード
function allsave(){
var ...
0
票
2
回答
219
閲覧数
ブラウザ幅を変更すると、inputが入力できなくなるときがある
以下のコードで、ブラウザ幅を狭めると、inputの編集ができなくなります。
どうもbootstrapのcssが影響しているようです。
感覚的にはグリッドシステムのcol-xs-**~col-sm-**の幅範囲になると起きているような気がします。
最小限のコードを切り出してみました。
同じ内容をcodepenにも入れてあります。
http://codepen.io/tomorin/pen/...
0
票
1
回答
553
閲覧数
行間を小さくするにはどうすれば良いでしょうか?
前提・実現したいこと
Ruby on rails ユーザー登録のフォームを作成中です。
Bootstrapを用いて作成しているのですが、
「パスワード」欄と「確認用パスワード」欄の間が
不自然に長くひらいてしまっております。
こちらをご参照下さい。
解決したいこと
この行間を縮めるためにはどのような方法がありますでしょうか?
何卒ご教示頂きたくお願い致します。
コード
app>...
2
票
1
回答
218
閲覧数
Bootstrapのfield.control-groupが干渉するせい?か、上手くcssが適応できませんでした
rails のslimとbootstrapを用いて
webのフロントサイドの実装をしておりました。
field.control-groupの中に、11項目程の入力フォームがある
アンケートフォームを作成しております。
以下のコードには2つしかありませんが、まだ、これが残り9つある状態です。
この実装でbootstrapのデザインがあたったフォームはつくれたのですが、
...
1
票
2
回答
3,692
閲覧数
Bootstrap3のModalダイアログが動きません
発行されたHTMLを読み込んでBootstrapのModalで美しく表示したいのですが、Bootstrap3のModalダイアログが動きません。どこが間違っていますか? 是非宜しくお願いします!!
<html>
<head>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/...
1
票
2
回答
2,888
閲覧数
モーダルダイアログの子ウィンドウから親ウィンドウの関数を呼び出す方法
cakePHP2 + mysql + bootsrap3 でサイトを構築しています。
親ウィンドウから、入力ウィンドウとして子ウィンドウ①を開き、
必要なIDがなければ生成するための子ウィンドウ②を立ち上げてID登録をして
子ウィンドウ①に返す といった処理を組もうとしています。
その際に、どのようにすれば子ウィンドウ①から子ウィンドウ②に値を返せるかが
わかりません。
お手数ですが、...
3
票
0
回答
185
閲覧数
Flat UI proの適用ができない
Flat UI Pro デザインフレームワークを reflection/designmodo-flatuipro-rails を使って、Rails4.2 のプロジェクトにインストールしようとしています。
参考サイトの手順でやっているのですが、うまく適用できません
STEP1
Flat-UI-HTML-Developers-License.zip をダウンロードしてデスクトップに解凍
...
4
票
2
回答
969
閲覧数
BootstrapのCSSを用いる際にclassを一括指定したい
現在、オフィシャルサイトの記述のような形でclassに値を設定しています:
<form>
<div class="form-group">
<label for="exampleInputEmail1">Email address</label>
<input type="email" class="form-...
0
票
1
回答
5,383
閲覧数
Twitter BootstrapのModalダイアログ内のフォームをエンターキーでSubmitする方法
以下の様なソートのためのModalダイアログをTwitter Bootstrapを用いて作成しています。
<div class="modal fade" id="sort_form_modal" tabindex="-1" role="dialog">
<div class="modal-dialog" data-keyboard="true">
<...
2
票
1
回答
1万
閲覧数
Twitter Bootstrapで、横並びのカラムの高さを「レスポンシブ的に」揃えたい
以下の様なよくあるサンプルだと、添付イメージ1のように、各カラムの高さが同一に書かれる事が多いと思います。
<div class="row">
<div class="col-md-12">ヘッダー</div>
</div>
<div class="row">
<div class="col-md-2">...
0
票
2
回答
5,859
閲覧数
Twitter Bootstrapを使ったレスポンシブで col-md-1 以下のサイズで表示する方法
Twitter Bootstrapを用いてレスポンシブのサイトを構築しているのですが、
col-md-1ですと最低でも12分の1のサイズにしかなりません。
チェックボックス一つだけを表示する幅があれば十分なので、ギリギリまで幅を詰めたいんですが何か方法はあるでしょうか?
なければ隣のカラムの先頭にチェックボックスを表示して、元のカラムは削除する形にしようと考えています。
7
票
1
回答
1,370
閲覧数
Bootstrap の mixin 利用時のライセンスは?
Bootstrap は LESS を使えば、mixin で部分的に利用できます。
では Bootstrap を部分的に利用した LESS を CSS にコンパイルして配布することは、ライセンス上、問題ないのでしょうか。
また、配布できる場合、ライセンス表記はどのようにすれば良いでしょうか。Bootstrap のライセンス (MIT) のほか、自身の選択したライセンス (たとえば Apache2)...