Recently, I came across a styling issue with a text area. After adding the following code to the view file of a Yii Application and the corresponding styling code to the CSS file, I noticed that the border of the text area remained unchanged when an error occurred, such as leaving the text area empty.
View file snippet:
<div class="form">
<?php echo $form->labelEx($model,'body'); ?>
<div class="clear"></div>
<?php echo $form->textArea($model,'body',array('style' => 'min-width:80%;max-width:80%;min- height:20%;max-height:200px;border:1px solid #666')); ?>
<?php echo $form->error($model,'body'); ?>
</div>
CSS styles:
.form .error label:first-child,.form .error {
color:#C00;
}
.form div.error textarea,div.form textarea.error{
background:#FEE;
border-color:#C00;
}
By moving the inline CSS from the HTML to the external stylesheet, the color of the border on the text area changed accordingly. This led me to question whether this alteration was due to the higher priority given to inline styles over external stylesheets or for some other reason.