質問編集履歴

3

コード修正

2015/03/26 06:02

投稿

q-fukutomo
q-fukutomo

スコア53

test CHANGED
File without changes
test CHANGED
@@ -74,7 +74,7 @@
74
74
 
75
75
  width: 645px;
76
76
 
77
- margin-top: 15px;
77
+ margin: 15px auto 0 auto;
78
78
 
79
79
  }
80
80
 

2

誤字修正

2015/03/26 06:02

投稿

q-fukutomo
q-fukutomo

スコア53

test CHANGED
File without changes
test CHANGED
@@ -42,7 +42,7 @@
42
42
 
43
43
  </div>
44
44
 
45
- <body>
45
+ </body>
46
46
 
47
47
  ```
48
48
 
@@ -64,9 +64,9 @@
64
64
 
65
65
  .center{
66
66
 
67
- margin: 0 auto;
67
+ margin: 0 auto;
68
68
 
69
- text-align: left;
69
+ text-align: left;
70
70
 
71
71
  }
72
72
 
@@ -84,9 +84,9 @@
84
84
 
85
85
  height: 800px;
86
86
 
87
- margin: none;
87
+ margin: 0;
88
88
 
89
- padding: none;
89
+ padding: 0;
90
90
 
91
91
  border: none;
92
92
 

1

コード追記

2015/03/26 05:56

投稿

q-fukutomo
q-fukutomo

スコア53

test CHANGED
File without changes
test CHANGED
@@ -15,3 +15,105 @@
15
15
  縦のスクロールはして問題ないのですが、横のスクロールはしないように幅を調整する方法を教えていただきたいです。
16
16
 
17
17
  よろしくお願いします。
18
+
19
+
20
+
21
+ -追記-
22
+
23
+ transform:scale(0.5);と記述したところ<iframe>のフレーム枠の幅が0.5倍になってしまいます
24
+
25
+
26
+
27
+ 現在のコード
28
+
29
+ __HTML__
30
+
31
+ ```lang-<HTML>
32
+
33
+ <body>
34
+
35
+ <div class="center content">
36
+
37
+ <iframe id="ifrm" src="http://hogehoge.com/">
38
+
39
+ <a href="http://hogehoge.com/">http://hogehoge.com/</a>
40
+
41
+ </iframe>
42
+
43
+ </div>
44
+
45
+ <body>
46
+
47
+ ```
48
+
49
+ __CSS__
50
+
51
+ ```lang-<CSS>
52
+
53
+ body{
54
+
55
+ min-width: 700px;
56
+
57
+ padding: 0;
58
+
59
+ margin: 0;
60
+
61
+ text-align: center;
62
+
63
+ }
64
+
65
+ .center{
66
+
67
+ margin: 0 auto;
68
+
69
+ text-align: left;
70
+
71
+ }
72
+
73
+ .content{
74
+
75
+ width: 645px;
76
+
77
+ margin-top: 15px;
78
+
79
+ }
80
+
81
+ #ifrm{
82
+
83
+ width: 645px;
84
+
85
+ height: 800px;
86
+
87
+ margin: none;
88
+
89
+ padding: none;
90
+
91
+ border: none;
92
+
93
+ // <iframe>の中身を横幅半分にして表示したい
94
+
95
+ transform:scale(0.5);
96
+
97
+ -o-transform:scale(0.5);
98
+
99
+ -webkit-transform:scale(0.5);
100
+
101
+ -moz-transform:scale(0.5);
102
+
103
+ -ms-transform:scale(0.5);
104
+
105
+ // 縮小の基準点を中央一番上(645/2≒323)に
106
+
107
+ transform-origin:323 0;
108
+
109
+ -o-transform-origin:323 0;
110
+
111
+ -webkit-transform-origin:323 0;
112
+
113
+ -moz-transform-origin:323 0;
114
+
115
+ -ms-transform-origin:323 0;
116
+
117
+ }
118
+
119
+ ```