teratail header banner
teratail header banner
質問するログイン新規登録

質問編集履歴

5

試したこと追加

2020/04/28 09:05

投稿

chocolate_pie
chocolate_pie

スコア26

title CHANGED
File without changes
body CHANGED
@@ -68,11 +68,28 @@
68
68
  ```
69
69
 
70
70
  ### 試したこと
71
- <p class="text-center></p>も効かず、親要素と思われる<div>にtext-align:center;
71
+ <p class="text-center"></p>も効かず、親要素と思われる<div>にtext-align:center;
72
72
  を付けましたがびくともしません。
73
73
  また、bootstrapのボタンの中央寄せのcenter-blockも効きませんでした。
74
74
  もしやrailsで条件分岐しているからでしょうか?
75
75
 
76
76
  ### 補足情報(FW/ツールのバージョンなど)
77
+ bootstrapのボタンのデフォル設定がいけないっぽいです。
78
+ cromeの開発者ツールで見たところ、
79
+ .button {
80
+ float: left;
81
+ margin: 0;
82
+ }
83
+ .center-block {
84
+ display: block;
85
+ }
86
+ .btn-success {
87
+ color: #fff;
88
+ background-color: #5cb85c;
89
+ border-color: #4cae4c;
90
+ }
91
+ になっていました。
92
+ 勝手に左寄せにされています。
93
+ しかし、float:leftを消したところで変わりませんでした…。
77
94
 
78
95
  初心者で至らない点があると思いますがよろしくお願いします。

4

css修正

2020/04/28 09:05

投稿

chocolate_pie
chocolate_pie

スコア26

title CHANGED
File without changes
body CHANGED
@@ -61,6 +61,10 @@
61
61
  .notice_setting{
62
62
  text-align:center;
63
63
  }
64
+
65
+ .ssss{
66
+ text-align:center;
67
+ }
64
68
  ```
65
69
 
66
70
  ### 試したこと

3

コード修正

2020/04/28 08:52

投稿

chocolate_pie
chocolate_pie

スコア26

title CHANGED
File without changes
body CHANGED
@@ -8,13 +8,13 @@
8
8
  ### 該当のソースコード
9
9
 
10
10
  ```HTML
11
- <div class="panel panel-default">
11
+ <div class="panel panel-default">
12
12
  <div class="panel-heading">
13
13
  <p class="text-center panel-title">通知設定</p>
14
14
  </div>
15
15
  <div class="panel-body notice_button">
16
16
  <div class="notice_setting">
17
- <%= form_for(@user, url:{controller:'users', action:'notify_setting_update'}), do |f| %>
17
+ <%= form_for(@user, url:{controller:'users', action:'notify_setting_update'}) do |f| %>
18
18
  <%= f.fields_for :user_groups, @user.user_groups.where(team_id: @current_team_id) do |ug| %>
19
19
  <% if ug.object.group.group_name != "共通" %>
20
20
 

2

コード修正

2020/04/28 08:49

投稿

chocolate_pie
chocolate_pie

スコア26

title CHANGED
File without changes
body CHANGED
@@ -8,16 +8,16 @@
8
8
  ### 該当のソースコード
9
9
 
10
10
  ```HTML
11
- <div class="panel panel-default">
11
+ <div class="panel panel-default">
12
12
  <div class="panel-heading">
13
13
  <p class="text-center panel-title">通知設定</p>
14
14
  </div>
15
15
  <div class="panel-body notice_button">
16
16
  <div class="notice_setting">
17
- <%= form_for(@user, url:{controller:'users', action:'notify_setting_update'}) do |f| %>
17
+ <%= form_for(@user, url:{controller:'users', action:'notify_setting_update'}), do |f| %>
18
18
  <%= f.fields_for :user_groups, @user.user_groups.where(team_id: @current_team_id) do |ug| %>
19
19
  <% if ug.object.group.group_name != "共通" %>
20
- <div class="notice_setting">
20
+
21
21
  <p class="text-center"><%= ug.label :グループ名: %><%= ug.object.group.group_name %></p>
22
22
  <br>
23
23
  <!-- 現在のLINE通知設定に応じてセレクトボックスの表示内容切替 -->
@@ -44,14 +44,13 @@
44
44
  <p class="text-center"><%= "編集可能なグループはありません。" %></p>
45
45
  <!-- 通知設定更新ボタン -->
46
46
  <% else %>
47
-            <!--これがボタンです↓ -->
48
- <%= f.submit "勤怠通知設定更新", class: "button btn btn-success center-block" %>
47
+ <div class="ssss"> <%= f.submit "勤怠通知設定更新", class: "button btn btn-success center-block" %></div>
49
48
  <% end %>
50
49
  <% end %>
50
+
51
- </div>
51
+ </div>
52
- </div>
52
+ </div>
53
- </div>
53
+ </div>
54
- </div>
55
54
  ```
56
55
 
57
56
  ```css

1

画像追加

2020/04/28 08:47

投稿

chocolate_pie
chocolate_pie

スコア26

title CHANGED
File without changes
body CHANGED
@@ -1,5 +1,7 @@
1
1
  ### 前提・実現したいこと
2
2
  railsのerbとhtml,cssでフォームの見た目を作っていたのですが、ボタン要素だけ中央揃えになりません。
3
+ 現在、画像のような状態になっています。ボタンも中央揃えしたいです。
4
+ ![イメージ説明](6b2a888cb423c295169057342ffb8233.png)
3
5
 
4
6
  ### 発生している問題・エラーメッセージ
5
7
  ボタンだけ中央揃えにならない