input元素相對父級元素錯位了?IE7

2021-08-29 18:17:43 字數 450 閱讀 8037

先看**:

期望結果:

div1距離左邊邊距100px,div2中的input距離div1的左邊距離為0 ie6、7表現異常:

div2中的input距離div1的左邊距離為100px,也就是說繼承了父級div1的margin-left

ie8、9,chrome,ff表現正常

原因:產生這種錯誤的原因是因為當input僅僅包含父元素,父元素擁有layout,和margin-left屬性時,ie6和7的input就會錯誤的繼承margin-left這樣的屬性。

解決辦法:

給input元素外面套乙個span,label這樣的內聯元素,這樣就會消除bug。 原理很簡單,input父元素是內斂元素,就不會繼承margin-left了。

**:

浮動元素撐起父級元素

浮動會使元素脫離文件流,如果不設定父級高度,父級將失去高度,影響頁面布局。這裡總結了一些常用的方法,是父級 有高度 1.設定父級高度 設定乙個合適的高度,這種方法比較適用於元素高度固定的場景。2.設定父級元素 overflow hidden 這種方法比較簡單,但要確保父級元素沒有溢位樣式。3.設定父...

position fixed 相對父元素定位

position fixed是對於瀏覽器視窗定位的,要實現相當於父元素定位,可以這樣 不設定fixed元素的top,bottom,left,right,只設定margin來實現。這種方法本質上fixed元素還是相當於視窗定位的,實現效果上是相對于父元素定位。此外,position fixed元素會受...

jquery獲取父級元素 子級元素 兄弟元素的方法

jquery.parent expr 找父親節點,可以傳入expr進行過濾,比如 span parent 或者 span parent class jquery.parents expr 類似於jquery.parents expr 但是是查詢所有祖先元素,不限於父元素 jquery.childre...