質問編集履歴
2
min-width:1000pxのcssを追記しました。
title
CHANGED
File without changes
|
body
CHANGED
@@ -5,6 +5,8 @@
|
|
5
5
|
2カラムから、1カラムレイアウトにしたいです。
|
6
6
|
解決策を教えて下さい。
|
7
7
|
|
8
|
+
※通常サイズのcssも追記します。
|
9
|
+
|
8
10
|
```html
|
9
11
|
コード
|
10
12
|
<!DOCTYPE html>
|
@@ -120,4 +122,65 @@
|
|
120
122
|
text-align: center;
|
121
123
|
text-shadow: -1px -1px 0 #fff, 1px 1px 0 #aaa;
|
122
124
|
}
|
125
|
+
```
|
126
|
+
```css
|
127
|
+
コード
|
128
|
+
@media screen and (min-width:1000px) {
|
129
|
+
body {
|
130
|
+
width: 800px;
|
131
|
+
margin: auto;
|
132
|
+
background: #EEFFFF;
|
133
|
+
font-family: avenir, sans-serif;
|
134
|
+
}
|
135
|
+
h1 {
|
136
|
+
color: #00ff00;
|
137
|
+
background: #FFFFCC;
|
138
|
+
font-style: italic;
|
139
|
+
text-align: center;
|
140
|
+
border-top: 1px dashed #9933ff;
|
141
|
+
border-bottom: 1px dashed #9933ff;
|
142
|
+
padding: 10px;
|
143
|
+
margin: 10px;
|
144
|
+
text-shadow: 2px 2px 3px #999;
|
145
|
+
}
|
146
|
+
h2 {
|
147
|
+
margin-top: 10px;
|
148
|
+
}
|
149
|
+
|
150
|
+
ul {
|
151
|
+
padding-bottom: 20px;
|
152
|
+
}
|
153
|
+
/* デフォルトリンク色の設定 */
|
154
|
+
a {
|
155
|
+
color: #000080;
|
156
|
+
text-decoration: none;
|
157
|
+
}
|
158
|
+
a:hover {
|
159
|
+
color: #cce739;
|
160
|
+
text-decoration: underline;
|
161
|
+
}
|
162
|
+
/* グローバルナビゲーション
|
163
|
+
---------------------------*/
|
164
|
+
#gnav{
|
165
|
+
text-align: center;
|
166
|
+
}
|
167
|
+
#gnav li {
|
168
|
+
display: inline;
|
169
|
+
padding-right: 10px;
|
170
|
+
font-weight: bold;
|
171
|
+
}
|
172
|
+
.mainphoto {
|
173
|
+
width: 400px;
|
174
|
+
height: 400px;
|
175
|
+
margin-right: 20px;
|
176
|
+
background: #ff0000;
|
177
|
+
float: left;
|
178
|
+
}
|
179
|
+
.clear {
|
180
|
+
clear: both;
|
181
|
+
}
|
182
|
+
.main {
|
183
|
+
overflow: hidden;
|
184
|
+
/* 追記 */
|
185
|
+
}
|
123
186
|
```
|
1
title
CHANGED
File without changes
|
body
CHANGED
@@ -3,6 +3,7 @@
|
|
3
3
|
メイン画像(**クラス:__mainphoto__です**。)のみ消えて1カラムになります。
|
4
4
|
|
5
5
|
2カラムから、1カラムレイアウトにしたいです。
|
6
|
+
解決策を教えて下さい。
|
6
7
|
|
7
8
|
```html
|
8
9
|
コード
|