Using css * universal rule

[skru09]

Hi

 

I am trying to reset the width of a selected image to 99px in my php page. So i used the css * universal rule to reset the value.

 

Please find below the code snippet:

 

<style type = "text/css">

.faculty-image {

max-width: 99px;

border: 1px solid #999;

}

 

* html .faculty-image { width: 99px; }

</style>

 

<?php

//php code which retrieves the images

echo '<td valign="top"> <img class="/faculty-image/" src="'.$test.'"/></td>';

?>

 

The above code did not reset the width.Hence i made changes like:

* img { width: 99px; }

 

But this is resetting all the images on the page.

 

Please help me in this. I dont know how to apply the reset to that specific image which im echoing.

 

Thanks in advance.

 

[F1Fan]

Why do you have forward slashes before your double quotes?

[ignace]

But this is resetting all the images on the page.

 

That is not possible with the above CSS rules it's most presumably some other line that does that which is not shown in the above example as the rule that includes the *-character tells the browser to apply width: 99px on all elements that has a child-element  HTML that has a child-element with class .faculty-img which is none as no element contains the root element.

 

* html .faculty-img therefor should be .faculty-image

 

Also class="/faculty-image/" is incorrect and should be class="faculty-image"

[skru09]

@f1fan - thanks for pointing that out but earlier i had tried to use the class and the rules were not being applied.hence i was using the / as someone pointed out that its the way to do it.

 

@ignace - the browser creates a internal document tree representing all the HTML elements in the page to display.Then it reads the css rules and starts applying them to the element/s that match the selector specified in the rule. You can read more on this at http://webworksconsultant.com/frontend/what-is-wrong-with-universal-css-selector/.

 

So i placed my class at the end of the img tag.

 

Its working now.

 

Thanks!