Tuesday, March 04, 2008

IE bug: id and name in getElementById function


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title> Test id and name property in IE7 </title>
</head>
<body>
<input name="t1"/> Input tag with name t1, IE7 will alert "INPUT"<br />
<a name="t1">Anchor t1, if remove input element, IE7 will alert "A"</a><br />
<div id="t1">div tag with id t1</div>

<script type="text/javascript">
alert(document.getElementById('t1').tagName);
</script>
</body>
</html>

Opera has the same problem.

Monday, March 03, 2008

margin 和内联元素(inline elements)的关系

当将margin应用于内联元素时,margin的上下边距将不会影响到行高[产生的margin是存在的,不过因其是透明的故不能看得到],左右边距则会影响内联元素的左右间距。如果将一个将粗的border应用于内联元素上时,行高也不会发生变化,border将会覆盖其他元素的显示。
能够改变全文本的行间距的CSS属性只有:
1、line-height
2、font-size
3、vertical-align

Saturday, March 01, 2008

关于CSS中的position和float的二点说明

1、当float的元素的margin为负值时,其周边元素内容可能会覆盖到float元素上面。当float元素宽度大于容器宽度并margin为负值时,会使得float元素在容器二边都超出。
2、position: absolute的元素的一系列上级元素如果具有position:absolute/relative/fixed属性时,会根据其上级元素进行绝对定位。如果其上级元素没有position属性,则根据整个html文档定位。