<metahttp-equiv="X-UA-Compatible" content="IE=edge">
<script src="/Includes/google.js"type="text/javascript"></script>
<meta name="description" content="Research-based onlinephonics program for beginning readers that is revolutionizing the way educationalsoftware is purchased, delivered, and experienced by consumers.">
<meta name="keywords" content="phonics">
<title>ClickN KIDS Sample Lessons</title>


    <link href="/StyleSheets/PublicSite.css"rel="stylesheet" type="text/css">
    <link href="/StyleSheets/Borders.css"rel="stylesheet" type="text/css">
    <link href="/StyleSheets/PublicSite.css?v=150"rel="stylesheet" type="text/css" media="all">

    <script src="/Includes/google.js"type="text/javascript"></script>

   



<script src="//assets.pinterest.com/js/pinit_main.js"type="text/javascript" async=""></script>
<scriptsrc="//dnn506yrbagrg.cloudfront.net/pages/scripts/0018/6234.js?392737"type="text/javascript" async=""></script>
<script id="facebook-jssdk" src="//connect.facebook.net/en_US/all.js#xfbml=1&appId=574925529187301"></script>
<script id="twitter-wjs"src="https://platform.twitter.com/widgets.js"></script>
<scriptsrc="//www.cnkdigital.com/media/js/6080ff43e9b9c2b60021e0c3b1eafa8c.js"type="text/javascript"></script>
<style type="text/css" media="screen">#myId{visibility:hidden}</style>
<!--[if lt IE 8]>
<link rel="stylesheet" type="text/css"href="http://www.cnkdigital.com/skin/frontend/default/default/css/styles-ie.css"media="all" />
<![endif]-->
<!--[if lt IE 7]>
<script type="text/javascript"src="http://www.cnkdigital.com/media/js/b0a0ebb33544766f17ca2aa059233f09.js"></script>
<![endif]-->
<script type="text/javascript">
    $.noConflict();
</script>

<link href="/StyleSheets/homepage2.css" rel="stylesheet"type="text/css">
<linkhref="//www.cnkdigital.com/skin/frontend/default/cnk/css/cnk.css"rel="stylesheet" type="text/css" media="all">
<link href="//fonts.googleapis.com/css?family=Lato:300,400,900"rel="stylesheet" type="text/css">
<style>
#mainwrapper {width:980px;}
#main {width:980px; background:#ffffff;}
h2 {color: #000000;}
#block_cns ul {list-style-type: disc;}
p {margin:0; margin-bottom:1.1em; padding:0; text-align:inherit;font-size:100%; font-weight:inherit;}
footer {text-align:center;}
#login_title h1 {color:#fff;}
body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, a, em, img, strong,b, u, i, ol, ul, li, form, label, table, tbody, tfoot, thead, tr, th, td{vertical-align:middle;}
</style>

    <div align="center"id="mainwrapper">
    <div id="main">





 <div class="clearFloat"></div>
    <hr>
   
<iframe src="http://www.clicknkids.com/Samples/samples.php"style="width: 100%; height: 750px; overflow: hidden; margin-top:20px;"></iframe>
  
<div class="clearFloat" style="height:15px;"></div>
<!-- footer changes to allow it to rest on the bottom -->
<div class="push"></div>
</div></div>
<!-- end changes -->
<div class="clearFloat"></div>

 <div class="clearFloat"></div>
 
 
<script type="text/javascript">
setTimeout(function(){var a=document.createElement("script");
var b=document.getElementsByTagName("script")[0];
a.src=document.location.protocol+"//dnn506yrbagrg.cloudfront.net/pages/scripts/0018/6234.js?"+Math.floor(newDate().getTime()/3600000);
a.async=true;a.type="text/javascript";b.parentNode.insertBefore(a,b)},1);
</script>

아래 사진부분만 화면에 맞게 나오게 하고싶은데 어떻게 수정해야하나요??

그냥 넣으니까 가로사이즈가 최대로 되어서 그런가 화면이 이상하게 나오더라고요.. ㅜㅜ

어떻게 바꿔야하나요?