开发者

Redundant CSS rules ie float & display:block

开发者 https://www.devze.com 2023-03-13 15:43 出处:网络
I just found out that floating an element will also make it开发者_StackOverflow中文版 a block, therefore specifying a float property and display:block is redundant.

I just found out that floating an element will also make it开发者_StackOverflow中文版 a block, therefore specifying a float property and display:block is redundant.

(What would happen if you tried to specify display:inline and float:left? )

Are there any other examples of redundant combinations to watch out for? block & width ? etc,

Is there a tool that can check for such things?


I just found out that floating an element will also make it a block, therefore specifying a float property and display:block is redundant.

Yes, display: block is redundant if you've specified float: left (or right).

(What would happen if you tried to specify display:inline and float:left? )

display: inline will not make any difference, because setting float: left forces display: block "no matter what":

http://www.w3.org/TR/CSS2/visuren.html#dis-pos-flo

Otherwise, if 'float' has a value other than 'none', the box is floated and 'display' is set according to the table below.

To summarize said table: float = display: block.

However, your specific example of float: left; display: inline is useful in one way - it fixes an IE6 bug.

Are there any other examples of redundant combinations to watch out for? block & width ? etc,

Some examples:

  • If you set position: absolute, then float: none is forced.
  • The top, right, bottom, left properties will not have any effect unless position has been set to a value other than the default of static.

Is there a tool that can check for such things?

I don't think so. It's not something that is ever needed, so I can't see why anybody would have written such a tool.


From my experience IE6 has problems with float:left. For compatibility, display:inline is added with floating statements.

0

精彩评论

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

关注公众号