設置背景顏色或一個div失敗時給字段

我希望這裏有人能幫助我在裏面，我是比較新的CSS和jQuery，但我似乎無法環繞我我的頭在這種情況下做錯了。設置背景顏色或一個div失敗時給字段

我有一個形式，標籤，輸入和選擇。我找到了一個有用的教程，向我展示瞭如何在輸入輸入或選擇時向父div添加背景顏色，在我繼續前進時刪除了該輸入或選擇。本教程是在這裏，http://css-tricks.com/improved-current-field-highlighting-in-forms/

我使用的CSS真的很簡單：

.curFocus {background-color: #fdecb2}

當一些簡單的jQuery它奇妙的工作使用。然後，我把所有的標籤和輸入放在一個fieldset中，現在，我的css不再被啓用。

這個例子的工作原理：

<div class="row"> 
    <label for="username">Your name:</label> 
    <input type="text" name="username" id="username"/> 
</div>

這個例子不起作用：

<fieldset class="align"> 
    <div class="row"> 
    <label for="username">Your name:</label> 
    <input type="text" name="username" id="username"/> 
    </div> 
</fieldset>

我對頁面的CSS是這樣的：

.align { 
    border: none; 
    border-width: 0px; 
    margin: 0px; 
    padding: 0px; 
    padding-top: 1px; 
} 
.align label { 
    float: left; 
    width: 45%; 
    padding-top: 0.6em; 
    padding-left: 1em; 
    margin-right: 0.5em; 
} 
.align input { 
    float: left; 
    width: 45%; 
} 
.align select { 
    float: left; 
    width: 46%; 
}

有誰知道我可以重新啓用活動字段突出顯示？

來源

2010-11-16 aodj

它應該工作，儘量手動插入CSS即：.row {背景顏色：＃fdecb2}到CSS。它工作嗎？ – 2010-11-16 14:14:17

仍然有效。 – aodj 2010-11-16 14:26:10

我認爲這是行不通的，因爲DIV的是塊元素，而你漂浮在它的輸入/標籤要素。由於這些漂浮物，div沒有任何高度。嘗試添加到您的CSS文件：

.align div { 
    overflow: hidden; 
}

可能解決它？

編輯有關清除漂浮的詳細信息，請this site of PPK

來源

2010-11-16 14:30:32

太棒了，修復了它。我將它添加到CSS中，他們現在顯示得很好，謝謝！ – aodj 2010-11-16 14:40:33

是的浮動和塊可以變得非常混亂有時......很高興幫助！ – 2010-11-16 14:43:56

認爲TI是它們的寬度。你在標籤和輸入上有45％，使用這個或使用你的，只需設置字段的寬度。並取出padding-top: 0.6em;

.align { 
    border: none; 
    border-width: 0px; 
    margin: 0px; 
    padding: 0px; 
    padding-top: 1px; 
    width:300px; 
} 
.align label { 
    float: left; 
    width: 45%; 
    padding-left: 1em; 
    margin-right: 0.5em; 
} 
.align input { 
    float: left; 
    width: 45%; 
} 
.align select { 
    float: left; 
    width: 46%; 
}

take a look.

來源

2010-11-16 14:33:34 cac

設置背景顏色或一個div失敗時給字段

回答

相關問題