CSS複数のクラスのプロパティをオーバーライド

Question

私は、次のような定義されたスタイルクラスがある場合：

.myclass{ 
    //bunch of other stuff 
    float:left; 
} 

をし、私はこのような別のクラス定義：

.myclass-right{ 
    float:right; 
} 

を、私はdiv要素をこのように定義する：

を

<div class="myclass myclass-right"></div> 

divはmyclassからすべて継承しますが、浮動小数点数をfloatプロパティに上書きします：right？それは私が起こることが期待されるものです。また、クロスブラウザーの影響があるかどうかを知りたい（良いブラウザー対IE 7以上、f *** IE6）。

Answer 1

をオーバーライドする必要があります.myclassの後に定義されます。

編集の拡張：html要素に表示されるクラスの順序は無効です。セレクタの特異性とセレクタがスタイルシートに表示される順序が重要です。

Answer 2

!importantを使用すると、それを行う方法の1つです。また

.myclass-right{ 
    float:right !important; 
} 

あなたのセレクタと、より具体的であれば、それは限りセレクタが同じ特異性を有する（この場合には、彼らが行う）と.myclass-rightスタイルブロックがあるよう

に同様

div.myclass-right{ 
    float:right; 
} 

Answer 3

myclass-rightは、あなたのCSSファイルの中でと宣言されている限り動作します。

Answer 4

だけに加えて、別のオプションを捨てるたかった重要なだけでなく、スタイル定義の順序：！CSSが競合を属性場合

.myclass.myclass-right{float:right;} 
.myclass{float:left;} 

Answer 5

、CSSタグ：あなたが連鎖一緒に2と同様にすることができますこれはの後にとなり、他のスタイルシートが優先されます。

他の言い方をすると、あるクラスが他のクラスを上書きするようにしたい場合は、CSSファイルの最後に置いてください。