teratail
回答率
85.48%
質問するログイン新規登録
トップに関する質問ヘッダー作成においての表示方法

編集履歴

質問編集履歴

3

書式の改善

2016/05/12 09:58

投稿

SuzukiYuitiro
SuzukiYuitiro

スコア28

test CHANGED
File without changes
test CHANGED
@@ -1,4 +1,4 @@
1
- 現在Ruby on rails、HTMLでWebアプリケーションを作ろうとしているものですが現在ヘッダーを作成している段階で検索機能の部分をログイン、新規登録の上に表示させたいのですがどうしても下にづれてしまいます。どのようにHTML、CSSでに表記すれば良いのでしょうか。
1
+ ###現在Ruby on rails、HTMLでWebアプリケーションを作ろうとしているものですが現在ヘッダーを作成している段階で検索機能の部分をログイン、新規登録の上に表示させたいのですがどうしても下にづれてしまいます。どのようにHTML、CSSでに表記すれば良いのでしょうか。
2
2
 
3
3
  申し訳ありません修正いたしました。
4
4
 
@@ -16,11 +16,9 @@
16
16
 
17
17
 
18
18
 
19
- ```HTML
19
+ ```html
20
20
 
21
-
22
-
23
- <div class="header">
21
+ <div class="header">
24
22
 
25
23
  <div class="container">
26
24
 
@@ -58,29 +56,29 @@
58
56
 
59
57
 
60
58
 
61
- <div class="btn-group" role="group">
59
+ <div class="btn-group" role="group">
62
60
 
63
61
  <button type="button" class="btn btn-warning">ログイン</button>
64
62
 
65
- </div>
63
+ </div>
66
64
 
67
- <div class="btn-group" role="group">
65
+ <div class="btn-group" role="group">
68
66
 
69
67
  <button type="button" class="btn btn-info">簡単登録</button>
70
68
 
71
- </div>
69
+ </div>
72
70
 
73
71
  <form class="navbar-form navbar-left" role="search">
74
72
 
75
- <div class="form-group">
73
+ <div class="form-group">
76
74
 
77
- <input type="text" class="form-control" placeholder="検索キーワード">
75
+ <input type="text" class="form-control" placeholder="検索キーワード">
78
76
 
79
- </div>
77
+ </div>
80
78
 
81
- <button type="submit" class="btn btn-default">検索</button>
79
+ <button type="submit" class="btn btn-default">検索</button>
82
80
 
83
- </form>
81
+ </form>
84
82
 
85
83
  </div>
86
84
 
@@ -94,7 +92,9 @@
94
92
 
95
93
 
96
94
 
95
+
96
+
97
- ```CSS
97
+ ```css
98
98
 
99
99
 
100
100
 

2

書式の改善

2016/05/12 09:58

投稿

SuzukiYuitiro
SuzukiYuitiro

スコア28

test CHANGED
File without changes
test CHANGED
@@ -16,7 +16,9 @@
16
16
 
17
17
 
18
18
 
19
- ```ここに言語を入力
19
+ ```HTML
20
+
21
+
20
22
 
21
23
  <div class="header">
22
24
 
@@ -86,7 +88,13 @@
86
88
 
87
89
  </div>
88
90
 
91
+
92
+
93
+ ```
94
+
95
+
96
+
89
- ここからcss
97
+ ```CSS
90
98
 
91
99
 
92
100
 
@@ -178,4 +186,6 @@
178
186
 
179
187
  }
180
188
 
189
+
190
+
181
191
  ```

1

書式の改善、検索部分のhtml追加

2016/05/12 09:23

投稿

SuzukiYuitiro
SuzukiYuitiro

スコア28

test CHANGED
File without changes
test CHANGED
@@ -1,14 +1,24 @@
1
1
  現在Ruby on rails、HTMLでWebアプリケーションを作ろうとしているものですが現在ヘッダーを作成している段階で検索機能の部分をログイン、新規登録の上に表示させたいのですがどうしても下にづれてしまいます。どのようにHTML、CSSでに表記すれば良いのでしょうか。
2
+
3
+ 申し訳ありません修正いたしました。
2
4
 
3
5
  ![イメージ説明](9744bee9979180c648c595fa779490b2.png)
4
6
 
5
7
  ![イメージ説明](7fb985a428cb42060f64fb69c67686c1.png)
6
8
 
9
+ ↓今のコードだとこのようになってしまいます
10
+
11
+ ![イメージ説明](9e3ae6582ff3c6d6d34610ed2f5789b0.png)
12
+
7
13
 
8
14
 
9
15
  現在このように記述してあります
10
16
 
17
+
18
+
19
+ ```ここに言語を入力
20
+
11
- <div class="header">
21
+ <div class="header">
12
22
 
13
23
  <div class="container">
14
24
 
@@ -46,27 +56,35 @@
46
56
 
47
57
 
48
58
 
49
- <div class="btn-group" role="group">
59
+ <div class="btn-group" role="group">
50
60
 
51
61
  <button type="button" class="btn btn-warning">ログイン</button>
52
62
 
53
- </div>
63
+ </div>
54
64
 
55
- <div class="btn-group" role="group">
65
+ <div class="btn-group" role="group">
56
66
 
57
67
  <button type="button" class="btn btn-info">簡単登録</button>
58
68
 
59
- </div>
69
+ </div>
60
70
 
61
-
71
+ <form class="navbar-form navbar-left" role="search">
72
+
73
+ <div class="form-group">
74
+
75
+ <input type="text" class="form-control" placeholder="検索キーワード">
76
+
77
+ </div>
78
+
79
+ <button type="submit" class="btn btn-default">検索</button>
80
+
81
+ </form>
62
82
 
63
83
  </div>
64
84
 
65
85
  </div>
66
86
 
67
87
  </div>
68
-
69
-
70
88
 
71
89
  ここからcss
72
90
 
@@ -159,3 +177,5 @@
159
177
  .menu_down {
160
178
 
161
179
  }
180
+
181
+ ```