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

質問編集履歴

3

書式の改善

2016/05/12 09:58

投稿

SuzukiYuitiro
SuzukiYuitiro

スコア28

title CHANGED
File without changes
body 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
  ![イメージ説明](9744bee9979180c648c595fa779490b2.png)
4
4
  ![イメージ説明](7fb985a428cb42060f64fb69c67686c1.png)
@@ -7,9 +7,8 @@
7
7
 
8
8
  現在このように記述してあります
9
9
 
10
- ```HTML
10
+ ```html
11
-
12
- <div class="header">
11
+ <div class="header">
13
12
  <div class="container">
14
13
  <div class="header-left">
15
14
  <img alt="" src="/assets/catlogo.jpg" />
@@ -28,26 +27,27 @@
28
27
  </div>
29
28
  </div>
30
29
 
31
- <div class="btn-group" role="group">
30
+ <div class="btn-group" role="group">
32
31
  <button type="button" class="btn btn-warning">ログイン</button>
33
- </div>
32
+ </div>
34
- <div class="btn-group" role="group">
33
+ <div class="btn-group" role="group">
35
34
  <button type="button" class="btn btn-info">簡単登録</button>
36
- </div>
35
+ </div>
37
36
  <form class="navbar-form navbar-left" role="search">
38
- <div class="form-group">
37
+ <div class="form-group">
39
- <input type="text" class="form-control" placeholder="検索キーワード">
38
+ <input type="text" class="form-control" placeholder="検索キーワード">
40
- </div>
39
+ </div>
41
- <button type="submit" class="btn btn-default">検索</button>
40
+ <button type="submit" class="btn btn-default">検索</button>
42
- </form>
41
+ </form>
43
42
  </div>
44
43
  </div>
45
44
  </div>
46
45
 
47
46
  ```
48
47
 
49
- ```CSS
50
48
 
49
+ ```css
50
+
51
51
  header {
52
52
  height: 115px;
53
53
  border-bottom: 2px solid #dddddd;

2

書式の改善

2016/05/12 09:58

投稿

SuzukiYuitiro
SuzukiYuitiro

スコア28

title CHANGED
File without changes
body CHANGED
@@ -7,7 +7,8 @@
7
7
 
8
8
  現在このように記述してあります
9
9
 
10
- ```ここに言語を入力
10
+ ```HTML
11
+
11
12
  <div class="header">
12
13
  <div class="container">
13
14
  <div class="header-left">
@@ -42,8 +43,11 @@
42
43
  </div>
43
44
  </div>
44
45
  </div>
45
- ここからcss
46
46
 
47
+ ```
48
+
49
+ ```CSS
50
+
47
51
  header {
48
52
  height: 115px;
49
53
  border-bottom: 2px solid #dddddd;
@@ -88,4 +92,5 @@
88
92
  }
89
93
  .menu_down {
90
94
  }
95
+
91
96
  ```

1

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

2016/05/12 09:23

投稿

SuzukiYuitiro
SuzukiYuitiro

スコア28

title CHANGED
File without changes
body CHANGED
@@ -1,9 +1,14 @@
1
1
  現在Ruby on rails、HTMLでWebアプリケーションを作ろうとしているものですが現在ヘッダーを作成している段階で検索機能の部分をログイン、新規登録の上に表示させたいのですがどうしても下にづれてしまいます。どのようにHTML、CSSでに表記すれば良いのでしょうか。
2
+ 申し訳ありません修正いたしました。
2
3
  ![イメージ説明](9744bee9979180c648c595fa779490b2.png)
3
4
  ![イメージ説明](7fb985a428cb42060f64fb69c67686c1.png)
5
+ ↓今のコードだとこのようになってしまいます
6
+ ![イメージ説明](9e3ae6582ff3c6d6d34610ed2f5789b0.png)
4
7
 
5
8
  現在このように記述してあります
9
+
10
+ ```ここに言語を入力
6
- <div class="header">
11
+ <div class="header">
7
12
  <div class="container">
8
13
  <div class="header-left">
9
14
  <img alt="" src="/assets/catlogo.jpg" />
@@ -22,17 +27,21 @@
22
27
  </div>
23
28
  </div>
24
29
 
25
- <div class="btn-group" role="group">
30
+ <div class="btn-group" role="group">
26
31
  <button type="button" class="btn btn-warning">ログイン</button>
27
- </div>
32
+ </div>
28
- <div class="btn-group" role="group">
33
+ <div class="btn-group" role="group">
29
34
  <button type="button" class="btn btn-info">簡単登録</button>
30
- </div>
35
+ </div>
31
-
36
+ <form class="navbar-form navbar-left" role="search">
37
+ <div class="form-group">
38
+ <input type="text" class="form-control" placeholder="検索キーワード">
39
+ </div>
40
+ <button type="submit" class="btn btn-default">検索</button>
41
+ </form>
32
42
  </div>
33
43
  </div>
34
44
  </div>
35
-
36
45
  ここからcss
37
46
 
38
47
  header {
@@ -78,4 +87,5 @@
78
87
  margin-bottom: 25px;
79
88
  }
80
89
  .menu_down {
81
- }
90
+ }
91
+ ```