質問編集履歴
4
質問の変更
test
CHANGED
|
File without changes
|
test
CHANGED
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
練習でダッシュボード風なものを作成しています。
|
|
4
4
|
|
|
5
|
-
|
|
5
|
+
赤の部分をヘッダーと左のリスト内の白い部分に納め、下にはスクロールできるようにしたい。
|
|
6
6
|
|
|
7
7
|
他の項目をクリックすると色が変わるようにしたいです。
|
|
8
8
|
|
|
@@ -10,11 +10,9 @@
|
|
|
10
10
|
|
|
11
11
|
|
|
12
12
|
|
|
13
|
-
|
|
13
|
+
|
|
14
|
-
|
|
15
|
-
|
|
14
|
+
|
|
16
|
-
|
|
17
|
-
|
|
18
16
|
|
|
19
17
|
|
|
20
18
|
|
|
@@ -56,6 +54,8 @@
|
|
|
56
54
|
|
|
57
55
|
</ul>
|
|
58
56
|
|
|
57
|
+
<div class="content"></div>
|
|
58
|
+
|
|
59
59
|
```
|
|
60
60
|
|
|
61
61
|
|
|
@@ -178,6 +178,24 @@
|
|
|
178
178
|
|
|
179
179
|
}
|
|
180
180
|
|
|
181
|
+
|
|
182
|
+
|
|
183
|
+
.content {
|
|
184
|
+
|
|
185
|
+
position: fixed;
|
|
186
|
+
|
|
187
|
+
margin: 65px 0 50px 0;
|
|
188
|
+
|
|
189
|
+
width: 400px;
|
|
190
|
+
|
|
191
|
+
height: 500px;
|
|
192
|
+
|
|
193
|
+
margin: 0 auto;
|
|
194
|
+
|
|
195
|
+
background-color: red;
|
|
196
|
+
|
|
197
|
+
}
|
|
198
|
+
|
|
181
199
|
```
|
|
182
200
|
|
|
183
201
|
|
3
コードの編集
test
CHANGED
|
File without changes
|
test
CHANGED
|
@@ -12,7 +12,7 @@
|
|
|
12
12
|
|
|
13
13
|
### 困っていること
|
|
14
14
|
|
|
15
|
-
|
|
15
|
+
一応やろうとしていることはできたのですがcssコードをもっと簡潔に綺麗に書く方法があれば知りたいです。
|
|
16
16
|
|
|
17
17
|
|
|
18
18
|
|
2
画像の追記
test
CHANGED
|
File without changes
|
test
CHANGED
|
@@ -14,7 +14,7 @@
|
|
|
14
14
|
|
|
15
15
|
どのcssが邪魔しているか分からないが、意図した位置に項目一覧を置けなくて困っています。
|
|
16
16
|
|
|
17
|
-
|
|
18
18
|
|
|
19
19
|
|
|
20
20
|
|
1
cssコードの変更並びスクショの変更しました。 また不適切なタグをつけていたため削除しました。
test
CHANGED
|
File without changes
|
test
CHANGED
|
@@ -74,7 +74,7 @@
|
|
|
74
74
|
|
|
75
75
|
width: 100%; /*ヘッダーの横幅*/
|
|
76
76
|
|
|
77
|
-
background-color: #
|
|
77
|
+
background-color: #1d2731; /*ヘッダーの背景色*/
|
|
78
78
|
|
|
79
79
|
color: white; /*ヘッダーの文字の色*/
|
|
80
80
|
|
|
@@ -122,9 +122,7 @@
|
|
|
122
122
|
|
|
123
123
|
.dashboard {
|
|
124
124
|
|
|
125
|
-
position:
|
|
125
|
+
position: fixed;
|
|
126
|
-
|
|
127
|
-
top: 80px;
|
|
128
126
|
|
|
129
127
|
left: 0px;
|
|
130
128
|
|
|
@@ -134,11 +132,13 @@
|
|
|
134
132
|
|
|
135
133
|
padding: 0px;
|
|
136
134
|
|
|
135
|
+
margin-top: 65px;
|
|
136
|
+
|
|
137
137
|
border-top: 0px;
|
|
138
138
|
|
|
139
139
|
border: 1px solid #bbd;
|
|
140
140
|
|
|
141
|
-
bo
|
|
141
|
+
background-color: #3c4a58;
|
|
142
142
|
|
|
143
143
|
}
|
|
144
144
|
|
|
@@ -146,7 +146,9 @@
|
|
|
146
146
|
|
|
147
147
|
list-style: none;
|
|
148
148
|
|
|
149
|
-
background: #
|
|
149
|
+
background: #3c4a58;
|
|
150
|
+
|
|
151
|
+
color: white;
|
|
150
152
|
|
|
151
153
|
border-top: 1px solid #ccc;
|
|
152
154
|
|
|
@@ -176,6 +178,12 @@
|
|
|
176
178
|
|
|
177
179
|
}
|
|
178
180
|
|
|
181
|
+
```
|
|
179
182
|
|
|
180
183
|
|
|
184
|
+
|
|
181
|
-
|
|
185
|
+
**変更点**
|
|
186
|
+
|
|
187
|
+
cssコードの変更並びスクショの変更しました。
|
|
188
|
+
|
|
189
|
+
また不適切なタグをつけていたため削除しました。
|