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

質問編集履歴

2

min-width:1000pxのcssを追記しました。

2019/06/27 11:37

投稿

ocha9
ocha9

スコア23

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

2019/06/27 11:37

投稿

ocha9
ocha9

スコア23

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
  コード