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

回答編集履歴

1

コード追加

2020/02/02 07:52

投稿

hatena19
hatena19

スコア34367

answer CHANGED
@@ -8,4 +8,46 @@
8
8
  /*略*/
9
9
  }
10
10
  ```
11
- 左右のpaddingは0でも、text-align: center; で中央寄せになるのでいいのでは。
11
+ 左右のpaddingは0でも、text-align: center; で中央寄せになるのでいいのでは。
12
+
13
+
14
+ ---
15
+ 背景色は親要素に設定したほうがいいでしょう。
16
+ それも含めて修正したコード例です。
17
+
18
+ ```css
19
+ #introduction{
20
+ display: flex;
21
+ margin-top: 30px;
22
+ width: 100%;
23
+ background-color: #6CC6C4;
24
+ border-radius: 5px;
25
+ }
26
+
27
+ .child{
28
+ border-right:1px solid #595959;
29
+ }
30
+ #top-nav-last-child{
31
+ border-right: none;
32
+ }
33
+
34
+ #introduction .top-nav{
35
+ padding: 20px 0;
36
+ width: 20%;
37
+ overflow: hidden;
38
+ white-space: nowrap;
39
+ }
40
+
41
+ #introduction .top-nav a{
42
+ text-decoration: none;
43
+ color:white;
44
+ font-size: 13px;
45
+ font-weight: bold;
46
+ display: block;
47
+ text-align: center;
48
+ }
49
+
50
+ #introduction a:hover{
51
+ opacity: 0.6;
52
+ }
53
+ ```