CODEWITHSUNDEEP
css
user5491539
user5491539

Reputation: 11

External CSS properties not getting applied

I am primarily a mainframe developer and maintain a front end web application which was built in 2002 (but I joined it since 2012) and compatible only with IE 5. We have been surviving all these years with compatibility mode in IE. Now our client want us to make it compatible with IE 11. We just started off with a basic proof of concept taking one page and we noticed a couple of things with javascripts (fixed).

But we are stuck with an issue with our external style sheets. CSS properties are not being applied. When checked in debugger, there are check boxes are available for Position & Visibility attributes but top, left, and other things don't have check boxes and doesn't seem to apply. I researched a lot before posting this question but couldn't find a right answer. Here is a sample div and CSS.

<DIV id=PD_DIV_SEARCHBY class=srchSearchBy style="VISIBILITY: visible">
   ....
   ....
</DIV>

.srchSearchBy
{ position:absolute; visibility:hidden; -> Seems to work
  top:75; left:5; width:225; height:135; } -> Don't work

Please pardon my knowledge if something was mentioned inappropriately.

Thanks

Upvotes: 0

Views: 49

Answers (1)

Brino
Brino

Reputation: 2502

Per the comments, you should add quotes to your id and class declarations. You also need units for your dimensions.

If your styles are still not being applied, it may be because another rule is taking precedence in Cascade Order or Specificity. You may be able to use a more specific CSS selector. If not, you can use the !important exception, however this should be used sparingly.

HTML

<DIV id="PD_DIV_SEARCHBY" class="srchSearchBy">
   ....
   ....
</DIV>

CSS

.srchSearchBy{ 
    position:absolute; 
    visibility:hidden;
    top:75px !important; 
    left:5px !important; 
    width:225px !important; 
    height:135px !important; 
}

Upvotes: 1

Related Questions