user1175112
user1175112

Reputation: 21

How can i set position absolute for ie7 only

How can i set position absolute for ie7 only

this is not working in ie7.

 $(document).find('.fixedheader').css({'position':'absolute','top':'356px'});

Upvotes: 1

Views: 31

Answers (1)

DavidDomain
DavidDomain

Reputation: 15293

To add css rules targeting IE7 you can use an asterisk in front of the css rule e.g.

*position: absolute;

But this will not work with jQuery $('selector').css(... or $('selector').attr('style', ... methods.

The only way it worked for me was to add a style tag to the head of the page like so:

$('<style type="text/css">.fixedheader {*position:absolute;*top:356px}</style>').appendTo($('head'));

Here is an example:

Copy the following snippet to a new HTML document and test it in IE7 and any other browser.

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Document</title>
  <style>
    header {
      position: relative;
    }
    .fixedheader {
      width: 100%;
      min-height: 50px;
      background-color: black;

    }
  </style>
</head>
<body>
  <header>
   <div class="fixedheader"></div>
  </header>
<script src="https://code.jquery.com/jquery-1.11.3.min.js"></script>
<script>
  $('<style type="text/css">.fixedheader {*position:absolute;*top:356px}</style>').appendTo($('head'));
</script>
</body>
</html>

Upvotes: 1

Related Questions