开发者

position div in a cell

<html>
<head>
<style type="text/css开发者_运维知识库">
div
{
top: 10px;
left: 30px;
background-color: red;
width: 100px;
height: 30px;
}
</style>
</head>

<body>
<table width='500' border='1'>
<tr>
     <td height='300' width='250'></td>
     <td height='300' width='250'><div>content</div></td>
</tr>
</table>
</body>

</html>

How do I position the div 10/30px to the top/left of the right cell?

I also want the cell grows with div, if size of div exceed that of the cell.

Thanks, Cheng


CSS

margin-top: 10px;
margin-left: 30px;

However this is bad use of markup for presentation. Dont use tables for placement.


Use position: relative; on the cell, and position: absolute; on the div.


Add position:relative on the div

div
{
top: 10px;
left: 30px;
background-color: red;
width: 100px;
height: 30px;
position: relative;
}

By default valign of td is center, you might want to set it to top

Working demo

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜