본문 바로가기

html / javascript / css

레이아웃 고정


<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=euc-kr">
<style type="text/css">
div#aside{
 position: fixed;
 top: 20px;
 left: 860px;
}
</style>
<!--[if IE]>
<style type="text/css">
body{
 _background: expression("url(foo) fixed");
}
div#aside{
 _position: absolute;
 _top: expression(20+((document.compatMode && document.compatMode=="CSS1Compat")?documentElement.scrollTop:document.body.scrollTop)+"px");
}
</style>
<![endif]-->
</head>
<body leftmargin=0 marginwidth=0 topmargin=0 marginheight=0>

<table width=780 cellspacing=0 cellpadding=10 bgcolor=#eeeeee border=1 bordercolor=#b5b2b5 style="border-collapse:collapse; margin:20px">
<tr valign=top>
<td>
 <table cellspacing=0 cellpadding=0 width="100%">
 <tr>
 <td>
  <h1><font color="blue"><u>Fixed Layer for IE / Very Simple / 양키협찬</u></font></h1>
  <h1>LINE #01</h1>
  <h1>LINE #02</h1>
  <h1>LINE #03</h1>
  <h1>LINE #04</h1>
  <h1>LINE #05</h1>
  <h1>LINE #06</h1>
  <h1>LINE #07</h1>
  <h1>LINE #08</h1>
  <h1>LINE #09</h1>
  <h1>LINE #10</h1>
  <h1>LINE #11</h1>
  <h1>LINE #12</h1>
  <h1>LINE #13</h1>
  <h1>LINE #14</h1>
  <h1>LINE #15</h1>
  <h1>LINE #16</h1>
  <h1>LINE #17</h1>
  <h1>LINE #18</h1>
  <h1>LINE #19</h1>
  <h1>LINE #20</h1>
 </td>
 </tr>
 </table>
</td>
</tr>
</table>

<div id="aside">
 <table width=120 height=300 cellspacing=0 cellpadding=10 bgcolor=#dddddd border=1 bordercolor=#b5b2b5 style="border-collapse:collapse">
 <tr>
 <td>
 <h2>Example</h2>
 <p><font color=blue><b>↑↓</b></font></p>
 <p><a href="#" style="color:blue; text-decoration:underline">Fixed Layer</a></p>
 </td>
 </tr>
 </table>
</div>

</body>
</html>