Плавающий div в центре не работает в IE - PullRequest
1 голос
/ 11 мая 2011

допустим, у меня есть html-

    <div  id="submitPage" align="center" >
<div id="middlecontainer">
<p align="center" id="loading-image">&nbsp;<img  src="/cso/images/loading.gif" border="0" > <font color="red" >Submiting order...</font></p>
</div>
</div>

я пытаюсь перевести div submit_age в центр страницы ... я использовал следующие css, и они отлично работают в Мозиле, но не знаю почемуон не работает в IE-8 ..

#submitPage {
 border: 1px solid black;
 width: 746px;
 height:201px;
 background: aqua; 
 text-align: center;
 z-index: 99;
 position: fixed;
 display: block;
 margin:90px auto;
}
#middlecontainer{
 text-align: center;
 width: 91px;
margin: 0 327px;
}
#loading-image {
  position: absolute;
  top: 74px;
  left: 299px;
  z-index: 100;
}

Пожалуйста, позвольте мне сейчас, если я делаю что-то неправильно или пропускаю что-то, что нужно добавить для IE. Любой способ сделать это с помощью Jquery также будетоценили.

Мозила Снимок экрана

Спасибо.!

Ответы [ 2 ]

1 голос
/ 11 мая 2011

Извините, что сказал, но ... какой беспорядок.Смешивание HTML-атрибутов и CSS, центрирование, центрирование и центрирование.И центрирование.И теги шрифтов.И центрирование ...

Следует избегать указания центрированного текста для элемента, содержащего элементы блока, поскольку IE обрабатывает это неправильно и применяет центрирование к элементам блока, а не только к тексту.

Поскольку вы просто помещаете в элемент какой-то текст и изображение, вам нужен только элемент, изображение и текст:

<div  id="submitPage">
  <img src="/cso/images/loading.gif" alt="">Submitting order...
</div>

#submitPage {
  border: 1px solid black;
  width: 746px;
  height: 201px;
  background: #0ff; 
  z-index: 99;
  position: fixed;
  left: 50%;
  top: 90px;
  margin-left: -373px;
  line-height: 201px;
  text-align: center;
  color: #f00;
}
#submitPage img{
  margin-right: 10px;
  border: none;
}

Демо: http://jsfiddle.net/pkMqM/

1 голос
/ 11 мая 2011

Примечание: , пожалуйста, оптимизируйте свой CSS тоже, color:red устарело;

см. ДЕМО ниже

http://jsfiddle.net/2GmC4/

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...