CSS в IE против CSS в Google Chrome

#css #internet-explorer #google-chrome

#css #internet-explorer #google-chrome

Вопрос:

Я просто использовал следующую технику:

http://webdesign.about.com/od/css3/f/blfaqbgsize.htm

чтобы попытаться получить фоновое изображение точного размера страницы, независимо от того, что я делаю, это отлично работает в Google Chrome, но не в IE. Приведенный ими пример отлично работает в IE и GC, но я не вижу различий на двух сайтах. Вот мой код:

 <!DOCTYPE html  PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">


<html>      <head>      <title>             National Balloon Festival!      </title>        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>       <style type="text/css">             html, body {
                height: 100%;
                margin: 0;
                padding: 0;             }           img#bg {
                position:fixed;
                top:0;
                left:0;
                width:100%;
                height:100%;            }           #content {
                position:relative;
                z-index:1;
                top:0px;
                left:0px;           }       </style>        <!--[if IE 6]>      <style type="text/css">             html { overflow-y: hidden; }            body { overflow-y: auto; }          img#bg { position:absolute; z-index:-1; }           #content { position:static; }       </style>        <![endif]-->    </head>     <body style=''>         <body>          <img src="images/Field1.jpg" alt="background image" id="bg" />          <div id="content">All your content here - including headers, paragraphs, etc.</div>         </body>





</body> </html>
  

Ответ №1:

Хм, когда я использую ваш код (с моей собственной картинкой), кажется, все в порядке. Мне любопытно, какую версию IE вы используете?

Ответ №2:

Хм… По-видимому, изменение позиционирования на «абсолютное» позволило ему оказаться сверху.