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

回答編集履歴

3

Markdownのバグ修正

2018/08/16 14:24

投稿

liveasnotes
liveasnotes

スコア1284

answer CHANGED
@@ -1,8 +1,6 @@
1
1
  width:100%;なら,float:left;しても位置が変わらないのは当たり前です.
2
- (親要素の幅いっぱいに,その要素自身の幅も広げられているのですから,それ以上,左右に動きようがありません)
2
+ (親要素の幅いっぱいに,その要素自身の幅も広げられているのですから,それ以上,左右に動きようがありません)```.container```か,```.main.posts-index```か,さらにその上にかぶさっている要素のどれかの指定を変える必要があります
3
3
 
4
- ```.container```か```.main.posts-index```か,さらにその上にかぶさっている要素のどれかの指定を変える必要があります
5
-
6
4
  現状では提示されているソースコードがHTML,CSSともに不足しているので,全体像が分かるように,提示するコードを増やしてください.
7
5
  もし,どの部分を見せればよいか分からず,また既にネット上に公開されているなら,そのリンクを貼ってください.
8
6
 
@@ -11,7 +9,7 @@
11
9
 
12
10
  ---
13
11
 
14
- 追記(20180816)
12
+ # 追記(20180816)
15
13
 
16
14
  ```css
17
15
  .main {

2

追記

2018/08/16 14:24

投稿

liveasnotes
liveasnotes

スコア1284

answer CHANGED
@@ -7,4 +7,33 @@
7
7
  もし,どの部分を見せればよいか分からず,また既にネット上に公開されているなら,そのリンクを貼ってください.
8
8
 
9
9
  尚,通常HTMLにおいては,左上から要素が配置されるので,
10
- 左側が空白なら,特に指定されていない限りは,左寄せになるはずです
10
+ 左側が空白なら,特に指定されていない限りは,左寄せになるはずです
11
+
12
+ ---
13
+
14
+ 追記(20180816)
15
+
16
+ ```css
17
+ .main {
18
+ position: absolute;
19
+ top: 64px;
20
+ width: 100%;/*画面幅いっぱいに広がっている?*/
21
+ height: auto;
22
+ min-height: 100%;
23
+ background-color: #f5f8fa;
24
+ }
25
+
26
+ .container {
27
+ max-width: 600px;
28
+ margin: 60px auto;
29
+ /*margin: 上下余白 左右余白; ←左右余白にautoが指定:左右中央寄せ*/
30
+ padding-left: 15px;
31
+ padding-right: 15px;
32
+ clear: both;
33
+ }
34
+ ```
35
+
36
+ もし,「投稿一覧」が画面全体を覆っている(```.main```がbody要素の直下にある)なら,```.container```の```margin```を調節すればよいと考えられます
37
+ ```margin: 60px 0;```を指定してみてください
38
+
39
+ 上手くいかない場合は,サイトのスクリーンショットと,各枠がどのCSSセレクタと紐付いているか分かるよう説明を書き加えてください.

1

追記

2018/08/16 14:19

投稿

liveasnotes
liveasnotes

スコア1284

answer CHANGED
@@ -1,5 +1,5 @@
1
- width:100%;なら,
2
- float:left;しても位置が変わらないのは当たり前です.
1
+ width:100%;なら,float:left;しても位置が変わらないのは当たり前です.
2
+ (親要素の幅いっぱいに,その要素自身の幅も広げられているのですから,それ以上,左右に動きようがありません)
3
3
 
4
4
  ```.container```か```.main.posts-index```か,さらにその上にかぶさっている要素のどれかの指定を変える必要があります
5
5