Combining CLASS & STYLE in CSS

liunx

Guest
Hi...again,<br />
<br />
Is this possible?<br />
<div class="text" style="text-align:center;">text here</div><br />
<br />
Reason why I'm wondering is because I only need one section centered and do not want to write a complete style for the style sheet.<br />
<br />
<br />
Gandalf<br />
:D<!--content-->have you tested it?<!--content-->My bad, I forgot to word the question this way:<br />
<br />
Is this valid?<br />
<br />
Because I don't care if it just works, it must also be valid code otherwise I won't use it and I'll find another way around the issue.<br />
<br />
Gandalf<br />
:D<!--content-->it should be valid, i don't see why it wouldnt be...<br />
<br />
what happens is that the styles of the lement are set first by the definitions in class="" then whatever you put in the style="" at the last minute will take effect, effectivly overriding the values in class=""<br />
<br />
try running the page through the w3c validator to see what it thinks :P ( personally, if i test it and it worx then i'll do it dispite what the validator says }:-) )<!--content-->its valid if you are not using xhtml strict<!--content-->or you can set multiple classes, setup another class in your stylesheet .centered {text-align:center;}<br />
<br />
and then call it in like so:<br />
<br />
<div class="text centered">text here</div><br />
<br />
<br />
:D<!--content-->Originally posted by leoo24 <br />
or you can set multiple classes, setup another class in your stylesheet .centered {text-align:center;}<br />
<br />
and then call it in like so:<br />
<br />
<div class="text centered">text here</div><br />
<br />
<br />
:D <br />
<br />
i didn't know you could do that :confused: cool :cool:<!--content-->Originally posted by karinne <br />
i didn't know you could do that :confused: cool :cool: <br />
<br />
yeah it can come in quite handy at times :D <br />
<br />
i'm not sure about it validating to strict standards though.<!--content-->There is one way to find out though:<br />
<br />
<!-- m --><a class="postlink" href="http://jigsaw.w3.org/css-validator/validator-uri.html">http://jigsaw.w3.org/css-validator/validator-uri.html</a><!-- m --><!--content-->According to W3Schools it is correct. If more than one style sheet is present the value will be plucked from the more specific style sheet. As far as being valid I don't have a clue.<br />
Derek<!--content-->You can over-ride a stylesheet with some inline CSS, but the best option is to apply two classes to the element at the same time as shown above.<br />
<br />
<element class="foo bar"> .... </element><!--content-->
 
Back
Top