・CSSで中央配置（センターリング）する方法
・外部コンテンツをiframeサイズで拡大縮小させたり、固定幅コンテンツをウィンドウサイズでピッタリ表示させる方法
辺りを参考に画面中央に<iframe>を縮小して表示しようとしているのですが、上手くいきません。
表示したい幅は645px, 高さは800px
<iframe>で表示する元のページは幅がブラウザサイズによって可変(但しmin-width:655px;), 高さは2200pxです
縦のスクロールはして問題ないのですが、横のスクロールはしないように幅を調整する方法を教えていただきたいです。
よろしくお願いします。
-追記-
transform:scale(0.5);と記述したところ<iframe>のフレーム枠の幅が0.5倍になってしまいます
現在のコード
<body>
<div class="center content">
<iframe id="ifrm" src="http://hogehoge.com/">
<a href="http://hogehoge.com/">http://hogehoge.com/</a>
</iframe>
</div>
</body>
body{
min-width: 700px;
padding: 0;
margin: 0;
text-align: center;
}
.center{
margin: 0 auto;
text-align: left;
}
.content{
width: 645px;
margin: 15px auto 0 auto;
}
#ifrm{
width: 645px;
height: 800px;
margin: 0;
padding: 0;
border: none;
// <iframe>の中身を横幅半分にして表示したい
transform:scale(0.5);
-o-transform:scale(0.5);
-webkit-transform:scale(0.5);
-moz-transform:scale(0.5);
-ms-transform:scale(0.5);
// 縮小の基準点を中央一番上(645/2≒323)に
transform-origin:323 0;
-o-transform-origin:323 0;
-webkit-transform-origin:323 0;
-moz-transform-origin:323 0;
-ms-transform-origin:323 0;
}
メニュー
カレンダー
Clock
最新メンバー
投稿数
統計データ
Link to us
カウンター